57

Editing PSD without Photoshop

over 3 years ago from , Programmer

Hi, my name is Ivan and I am developing an image editor with a decent support for PSDs and XCFs.

My goal is not to replace Photoshop or Gimp, but to "give a chance" to people, who can not use Photoshop for some reason (it is too expensive, or you edit PSD just once a year, or you have Linux, etc.). I think there is no software with a good support for PSD on the market (except of PS).

In order to let users edit all properties of PSD, I had to make quite similar forms and UI, as in Photoshop (same blend modes, same layer styles, same adjustment layers, etc.), so it should look familiar to Photoshop users.

Can you tell me your oppinions? What features do you miss the most? Feel free to share it :) I believe it can be useful for many people, but nobody knows about it.

Photopea.com

Photopea title

50 comments

  • Zip ZapZip Zap, over 3 years ago

    Hey, I tested it with some random psd files and this is really nice, it handles layers and groups and openning files is really fast.

    I must say on a technical point of view this really impressive! Keep up the good work :D

    13 points
  • Tristam GochTristam Goch, over 3 years ago (edited over 3 years ago )

    Affinity Photo/Designer generally handle PSD files really well

    Seems risky building software solely on the principle of handling another company's proprietary files...

    8 points
    • Ivan Kutskir, over 3 years ago (edited over 3 years ago )

      Thanks for your comment. Affinity is quite expensive, while Photopea is free. I've heard that Affinity has problems with export to PSD.

      The fact, that each editor has its own format, is quite sad. Once you start using a specific program, it is hard to switch to another, because you already have lots of work in this format. I decided to support PSD, since it is the most common format among designers. If they would not be able to use PS, for some reason, all their PSDs would become useless.

      Adobe has online PSD specification , but I think they should put more effort into presenting PSD as "open format for everybody", just like Microsoft did with .docx , and encourage others to implement it.

      3 points
      • Luis RomeroLuis Romero, over 3 years ago (edited over 3 years ago )

        Affinity is quite expensive? nope, but I can understand your thoughts.

        0 points
        • Ivan Kutskir, over 3 years ago (edited over 3 years ago )

          Well, Affinity is definitely cheaper than Adobe's products :)

          2 points
        • Cody SanfilippoCody Sanfilippo, over 3 years ago

          50 bucks can be very expensive to some people. Nothing wrong with a free alternative!

          30 points
          • Patrick SmithPatrick Smith, over 3 years ago

            Is it expensive because: - Their income doesn’t cover it easily? - They prefer to pay for only for their most trusted and core tools?

            How much do some of these people pay for hardware?

            Curious for any answers, sorry if it comes across as ignorant!

            0 points
    • Mohsin NaqiMohsin Naqi, over 3 years ago

      Your point is moot because Affinity software are not even cross-platform, whereas the only requirement of this product is that you have a web browser, whether you're on MAC, Windows, or Linux.

      1 point
  • Geoff YuenGeoff Yuen, over 3 years ago

    I'm constantly amazed at what developers can build to work inside browsers. Between this and gravit.io we'll be able to do everything online and for free.

    4 points
    • Ivan Kutskir, over 3 years ago (edited over 3 years ago )

      Today, the biggest enemies of powerfull webapps are web browsers. Not that people use old versions of browsers, but even new browsers have lots of bugs or behave differently in some situations (e.g. in Photopea, Ctrl+T starts Free transform in Firefox, but it opens a new tab in Chrome ... this issue is 5 years old and still not fixed). Another problem is, that new standards (WebGL 2.0, WebCL, WebAssembly) are being implemented very slowly.

      0 points
  • Pino CeniccolaPino Ceniccola, over 3 years ago

    Photoshop in a browser with an API? Impressive!

    Kudos to you, Ivan.

    2 points
    • Ivan Kutskir, over 3 years ago

      Thank you! :) There is still a long way to go, before we can compare Photopea with Photoshop, Gimp, Affinity or other advanced editors :)

      1 point
  • Richard Gazdik, over 3 years ago

    A psd to sketch converter would be a nice feature. Many of us are still missing a proper tool like that.

    2 points
  • Mal SomMal Som, over 3 years ago (edited over 3 years ago )

    Hi great work! I like to design, design tools :P I'll lend a hand to make text editing UI Can you tell us a little bit about the tech, it's built on webgl like figma?

    1 point
    • Ivan Kutskir, over 3 years ago (edited over 3 years ago )

      Hi, you can find quite a lot of info at Photopea blog . It is built with Javascript for logic, HTML and CSS for UI. Project composition (merging all layers into one image) can be done with Javascript or WebGL (depending on whether WebGL is available in your browser). Thanks to WebGL, you can edit large files (big resolution, many layers) quite smoothly. I think that in some cases Photopea runs smoother than Photoshop.

      1 point
  • Cosmin NegoitaCosmin Negoita, over 3 years ago

    Very nice! Makes it easy to edit stuff on the go in case you don't have your machine around you!

    1 point
  • Benjamin Berger, over 3 years ago (edited over 3 years ago )

    That's really cool! The missing things for me would be: -more keyboard shortcuts (and mac keyboard shortcuts) -being able to select a layer by clicking on it (or using cmd+click)

    1 point
  • Dorin FrunzeteDorin Frunzete, over 3 years ago

    Wow!!! Great work :)

    1 point
  • stephen fstephen f, over 3 years ago

    Nice idea, however the first thing I opened was a fairly tall web design (first thing I saw on the my desktop), but once I'd used Photopea to zoom in to a more readable size I didn't have any way of scrolling up/down, was just stuck in the middle... bug?

    You also have to remember that Photoshop cs2 is available from adobe as a free download

    1 point
    • Ivan Kutskir, over 3 years ago (edited over 3 years ago )

      Thanks :) I expected everybody to "scroll" using a Hand tool (switch using Spacebar), I just added scrolling into my todo list :)

      By the way, I think it was some mistake on Adobe's website, they didn't mean to offer CS2 for free. But they have released Photoshop 1.0 as open source :)

      0 points
      • stephen fstephen f, over 3 years ago

        yeah, cs2 was an adobe mistake, but it's been sat there with you able to download it for the past few years so i doubt it's going anywhere, my guess would be they see it as a bit of a gate way for people downloading cs2 (or the retro Photoshop 1 you pointed out ha ha) then progressing and wanting to upgrade to cc.

        But anyway, that doesn't take away from the fact you're building something pretty cool thats fast, browser based and i real viable option for people that only want to jump on or edit a psd every now and again without having to install anything

        0 points
  • Saijo GeorgeSaijo George, over 3 years ago

    wow.. great work Ivan

    1 point
  • justin kent, over 3 years ago

    Wow, This is truly impressive! Keep up the good work

    1 point
  • Marshall Jones, over 3 years ago

    very impressive. any plans to open source?

    1 point
  • Dean HaydenDean Hayden, over 3 years ago

    Mobile at the moment so can't take a look but I love the idea. Could really help a lot of people and imagine it being part of a content creation workflow.

    0 points
    • Ivan Kutskir, over 3 years ago (edited over 3 years ago )

      You can open it on the mobile as well :) But it will be a little hard to "create" on a tiny screen :)

      0 points
  • Braden HammBraden Hamm, over 3 years ago

    Good timing for me! My photoshop has a weird bug where any time I try to use the text tool, it crashes. I thought I was going to have to recreate my whole UI in Sketch.

    Downloading now!

    0 points
  • Jon DarkeJon Darke, over 3 years ago

    Impressive. Make this work on iPad Pro and you've uncovered a gold mine

    0 points
    • Ivan Kutskir, over 3 years ago (edited over 3 years ago )

      It should work in every browser, including iPad. I have tested it only with Android browsers. But the problem is, that current UI requires a precise position input, it would be hard to control it with a finger. You would also miss keyboard shortcuts.

      0 points
      • Mal SomMal Som, over 3 years ago

        The ipad pro has the apple pencil which is as precise as a mouse if not more.

        0 points
        • Ivan Kutskir, over 3 years ago

          Wow, that is great! I would love to have some iPad testers, who can test Photopea on the iPad ... if you think you can do that, can you contact me on a Facebook page? :)

          0 points
  • Timur Carpeev, over 3 years ago

    Hi Ivan!

    This is a stunning project! Have you considered to make it open source? At the moment there are no good open source web based graphic editors, I feel like this can become a big one.

    In regards of the feedback, I have two points:

    • It would be great to have some feedback for selections, right now its unclear what is being selected.

    • Canvas has very poor text rendering engine, it would be great to have text rendered using DOM layers.

    0 points
    • Ivan Kutskir, over 3 years ago

      Hi Timur,

      I have considered making it open source, but I think it is not a good idea in my case. However, some parts of Photopea will be open-source (ultra fast PNG encoder, font parser etc.) and some parts already are (see http://blog.ivank.net)

      • what selections do you mean? There is only one selection that you work with. It is applied to the currently selected layer.
      • What do you mean by that? Are you having any problems with rendering text layers? Photopea does not use fillText() method of context2D of Canvas.

      Text layers inside PSDs can not be fully reproduced with DOM (HTML and CSS). E.g. there are text warp effects, which have no "analogy" in CSS.

      0 points
  • Surjith S MSurjith S M, over 3 years ago (edited over 3 years ago )

    Great work.

    Some problems I've found.

    • Ctrl + Z is not working?
    • Can't switch to layers easily as in photoshop. (Eg: Auto Click / Ctrl + Click)
    • Layer masking is not working?
    0 points
    • Ivan Kutskir, over 3 years ago

      Thanks!

      • I never understood the point of Ctrl+Z, (it just switches between the last and the current state in cycle ...), I prefer using Alt+Ctrl+Z / Shift+Ctrl+Z to navigate History.
      • What do you mean by switching to layers?
      • Layer masks should work, but clipping masks don't work yet.
      0 points
      • Surjith S MSurjith S M, over 3 years ago

        Thanks for the reply.

        Yes. Ctrl + Z will work for one state. But its really useful, I usually use it in Photoshop.

        In Photoshop, You may Ctrl + Click a layer to select that. Means you don't need to click the layers panel manually.

        Yes. Clipping mask I meant.

        2 points
    • Ivan Kutskir, over 3 years ago

      Hi, so there really was a bug while editing raster masks. I just fixed and It should work now :)

      0 points
  • Doug HardesterDoug Hardester, over 3 years ago

    Congrats on this. I checked it out with a complex PSD and it came out rather well. This can already be useful for those that need to view a PSD and not edit it. I look forward to seeing your progress – good luck!

    0 points
  • Dana (dmxt)Dana (dmxt), over 3 years ago

    Really nice work.

    Now please make one for Sketch. We've having confliction issues between Mac designers and Windows designers and programmers on their preferred platform.

    0 points
    • Ivan KutskirIvan Kutskir, over 3 years ago

      Well, I can not make a thing like that in a day :D But I can try to study the Sketch format and make some intuitive conversion method in the future.

      0 points
    • Christian Krammer, over 3 years ago

      Once Figma is out you will get your Sketch support. Also in the browser.

      0 points
  • Nicolás Joel EnglerNicolás Joel Engler, over 3 years ago

    Personally, I believe that this project is absolutely incredible. The fact that you're even considering Linux users just shows how invested you're in this. I wish you the best of luck with the whole development process of this tool.

    I'll give it a shot ASAP and will let you know how it goes. Keep up the amazing work, you rock!

    0 points
  • Drew AlbinsonDrew Albinson, over 3 years ago

    Hi Ivan, this is really neat and exciting! I'm not sure where the limits are with some classic functions in-browser but two things I use a lot in my work are clipping masks and the pressure function for brushes (for illustration with tablet). If these two features were integrated this would likely be my ideal on-the-go tool!

    0 points
    • Ivan Kutskir, over 3 years ago

      Thanks Drew! Clipping masks are already in my todo list, so It should be implemented very soon :)

      According to ptablet pressure, I think it is implemented into browsers, so I should have access to the pressure, but sadly, I don't have a hadrware to be able to test it :(

      1 point