I've been looking for an open source image editor that I can embed in my app for managing my vintage ad archives (https://adretro.com). Basically I just need to rotate, crop, adjust color. But the images come from from the archive database rather than upload. And I want to work with them quickly, rather than save/open like a desktop app. Last time I looked I couldn't find something with good documentation that was easy to get started with. Right now I bulk edit in Google Photos.
shunia_huang 6 hours ago [-]
Would be very nice if it is provided as a library to be able to integrated into another app with partial/full customizations for UI with different theme and stack.
Couple of issues I had: on mobile (Brave on Android) the touch controls for cropping are very janky. Feels like it steals control each time the picture updates maybe?
It's hard to see the controls under the picture on this small screen. Could you add a control to adjust the size of the controls and shrink the picture maybe?
GlassOwAter 6 hours ago [-]
I’m getting some touch control issues and inability to download the image on iOS.
popalchemist 8 hours ago [-]
Hey, awesome work! This is sorely needed in the OSS package space.
Are you taking into account separation of concerns? I could see myself adopting this if the UI were customizable in Vue, React, etc.
gtb_1 15 hours ago [-]
Did you consider using WebGPU, or creating a bridge between WebGPU / WebGL for this? Also, have you considered deploying on Cloudflare Pages [1] (unlimited bandwidth) instead of netlify?
I did consider WebGPU but I couldn't find many advantages for the current use case.
Yes I'm planning to move to the edge as soon as it's in a later stage of development
zorgmonkey 4 hours ago [-]
The biggest difference for you is probably that WebGPU has compute shaders and WebGL does not, they are pretty nice if you want to implement more complex algorithms.
It would be nice if I can feed an image blob to it, and return the edited image as a blob programmatically - i.e. without the need for an UI to open or download the image. That will help integration/embed it into other apps.
rebelnz 9 hours ago [-]
Really nice work. I had been using Photopea for cropping and quick edits when preparing references for painting but this is super clean and simple.
ww520 11 hours ago [-]
Excellent work. The UI looks very clean and functional. It's feature packed. Good choice on using WebGL. It has support everywhere in most if not all browsers.
amadeuspagel 15 hours ago [-]
Nice. I tried it with an image from Unsplash. Maybe you can use the Unsplash API[1] to give people an example to play with.
Will have a look at this thanks! in the meantime I've added a quick sample gallery to test the editor out
PaulDavisThe1st 8 hours ago [-]
Extremely nice work.
I'd like it if there were separate buttons for (a) reset a section (e.g. colors) back to the default and (b) do not use a section (e.g. colors). Right now, turning (e.g.) colors off loses the settings there. Maybe I missed something though.
sgc 8 hours ago [-]
I too agree this is great, and see space for another low-hanging UI tweak:
Allow editing numbers to right directly, instead of only using the slider. I really dislike using sliders beyond a first general impression because it is too slow to get things exactly as I want them. I would guess this is a relatively common sentiment.
One feature I don't see but would love to see is text overlay, but that is perhaps moving away from the spirit of the project.
PaulDavisThe1st 7 hours ago [-]
I don't do web based development (all native desktop), but I'd be quite surprised if this was "low hanging".
We have widgets that do this in Ardour and they were far from simple to implement.
sgc 6 hours ago [-]
I have done similar. It is pretty easy, you just have the slider update the input, that is used for the actual calculations. If I ever get past looking and actually download, I will do it.
Dwedit 9 hours ago [-]
Is there any interference from "anti-fingerprinting" which corrupts the image canvas?
flashblaze 14 hours ago [-]
I'm so glad this exsist. I've been meaning to get something similar started, but did not due to one reason or the other. I'll definitely try to contribute.
axelMI 13 hours ago [-]
Whenever you feel like, ping me on github
kreelman 8 hours ago [-]
This does useful things easily.
How hard would it be to use it as a batch process?
GlassOwAter 6 hours ago [-]
I like this. It reminds me of Snapseed. Feature request if it isn’t too hard, the ability to overlay an image and blend them together.
asadm 15 hours ago [-]
in the editor, do add a way to load sample random image to try out the editor instead of having to uploading my own (which most won't bother / don't trust / can't do at work).
axelMI 15 hours ago [-]
Great advise. Will add it next.
Bust just to be clear, images are handled 100% locally on the user machine. No data is sent to servers, no adv, no cookies, nothing ...
sam1r 6 hours ago [-]
wow, awesome turnaround dev time, i see the feature req has shipped already. \^-^/
asadm 15 hours ago [-]
Yup I get that.
axelMI 13 hours ago [-]
sample images added. thanks for the tip
fidotron 15 hours ago [-]
This is neat. Any plans to add blurs and related effects?
axelMI 13 hours ago [-]
yes, I don't use them but if required it will be easy to add
atonse 15 hours ago [-]
Very cool! What's the license, and how does it compare to some of the other croppers/editors out there? Was it mainly the GL integration?
axelMI 15 hours ago [-]
Ops forgot to add MIT license
As for the underlying modules on which it relies
Will fix it shortly
cmenge 13 hours ago [-]
Lol, I added a todo yesterday: "find or build good image cropper, ideally gl based" ;)
Guess the search might be over, thanks!
axelMI 13 hours ago [-]
let me know of any usability issue. I tried different combinations and this seemed intuitive for me (compared to other solution), but of course I'm too biased.
rendaw 13 hours ago [-]
What does comparable refer to here? Web based image editors? Like what?
axelMI 13 hours ago [-]
there are several web based image editors leveraging webgl out there.
I hope to match some of them in terms of features, but with a lightweight and opensource solution
neosat 13 hours ago [-]
Nice! Good performance, clean UI, and core functionality.
axelMI 13 hours ago [-]
thanks. It started as a proof of concept for a custom reactivity engine (based on signals and tagged template literals). But while at it I realised I needed something quick and easy for my needs.
I already have a prototype for a self-hosted photogallery that integrates this editor (something like https://immich.app to give you an idea). But it's still too early to share
stared 15 hours ago [-]
Thank you for sharing!
What's the license?
axelMI 15 hours ago [-]
MIT. thanks for point that out, I did forget to add it
quantadev 15 hours ago [-]
I tried to figure out how to crop an image and found nothing. There doesn't seem to be a crop feature as far as I could tell. I'm sure it's probably there, but not easy for anyone to figure out. Would be super easy to make it intuitive right?
axelMI 15 hours ago [-]
it's the composition menu ... will rename it
just select the area you wish to crop and then move to the other settings (colors, ...) to edit it
atonse 14 hours ago [-]
I did this but when I hit download, I got back the original image instead of the cropped image.
quantadev 13 hours ago [-]
I tried it again, and finally noticed you have to click the corner of the image to move the selection area. It works, but then I didn't see a "Crop" button. Only trying to be helpful, and not complaining. Nice work tho on this component.
axelMI 13 hours ago [-]
No no I absolutely need this kind of feedback thanks! Being a solo developer is very difficult to gage usability and UX is definitely not my strength.
I tried to integrate the crop/ composition in the natural workflow of image processing, without a discreet "crop" button. But I guess it's not necessarily the most intuite thing to do :)
quantadev 7 hours ago [-]
I'm the new member of your QA team now! haha. I'll try to crop again when you're ready. :)
Couple of issues I had: on mobile (Brave on Android) the touch controls for cropping are very janky. Feels like it steals control each time the picture updates maybe?
It's hard to see the controls under the picture on this small screen. Could you add a control to adjust the size of the controls and shrink the picture maybe?
Are you taking into account separation of concerns? I could see myself adopting this if the UI were customizable in Vue, React, etc.
[1] - https://pages.cloudflare.com/
Yes I'm planning to move to the edge as soon as it's in a later stage of development
[1]: https://unsplash.com/developers
I'd like it if there were separate buttons for (a) reset a section (e.g. colors) back to the default and (b) do not use a section (e.g. colors). Right now, turning (e.g.) colors off loses the settings there. Maybe I missed something though.
Allow editing numbers to right directly, instead of only using the slider. I really dislike using sliders beyond a first general impression because it is too slow to get things exactly as I want them. I would guess this is a relatively common sentiment.
One feature I don't see but would love to see is text overlay, but that is perhaps moving away from the spirit of the project.
We have widgets that do this in Ardour and they were far from simple to implement.
Bust just to be clear, images are handled 100% locally on the user machine. No data is sent to servers, no adv, no cookies, nothing ...
Guess the search might be over, thanks!
Some of them are very good such as https://img.ly/products/photo-sdk or https://www.polarr.com/web/ or https://pqina.nl/pintura/
I hope to match some of them in terms of features, but with a lightweight and opensource solution
I already have a prototype for a self-hosted photogallery that integrates this editor (something like https://immich.app to give you an idea). But it's still too early to share
What's the license?
just select the area you wish to crop and then move to the other settings (colors, ...) to edit it
I tried to integrate the crop/ composition in the natural workflow of image processing, without a discreet "crop" button. But I guess it's not necessarily the most intuite thing to do :)