21
K-ASS
3y

Made a website that can make images like this
Basically you just keep splitting the rectangle and color them
https://txstc55.github.io/draw-rect...

It’s very mobile unfriendly though

Need feedback on what you need, also this is an offline version and I’m planning to make it so that you can do it with your friend, just need to watch more YouTube videos on p2p now

Comments
  • 2
    Mona Lisa looks fucking dope.

    Not only liked the idea and the execution but absolutely loved the outcome.

    New art form and colour split if next level.

    Gonna try out now and start using it and share with my friends too.

    Awesome job bro :)
  • 1
    Feedback:

    1. One with arrow does not appear on mobile site.

    2. Circled one is evidently not a visible text.

    3. Tried uploading picture but didn't work.

    4. Labels, navigation, buttons, etc. aren't really clear.
  • 2
    @Floydimus thx, just remember to not use it on the phone

    The current version I pushed is only for offline use. I will @you when I’m done with the online version
  • 1
    @Floydimus the upload is not for picture, it’s for if you want to download the current path and load it for later.

    In the git repository there is a python file for automatically generate a path, it will take a while and you will need to tweak the parameters.
  • 1
    @K-ASS so UI needs improvement then.
  • 3
    @Floydimus ahhhhhh I just hate mobiles
  • 2
    At first I thought it can convert an existing image into this rectangle-ised version. Would be cool for avatars and stuff :)

    TBH I'm too lazy to draw images myself :D

    Cool idea tho!
  • 1
    @netikras then you can use the python file to generate a json which you can then upload to the website for it to draw
  • 2
    @K-ASS where is that .py file, what's the usage and what dependencies do I need to use it?
  • 1
    @netikras here: https://github.com/txstc55/...

    I didn’t work on usability of this script so let me guide you through

    GAP_SIZE is just how many pixels you jump for each search because you don’t wanna brute force every pixel
    MINIMUM_THRESHOLD is hard to explain but essentially lower means more points on the final picture
    SIGMA is used for sobel filter

    You can I comment line 26 and 27, which adds the grayscale image to sobel filter, essentially the algorithm is trying to recursively find the best point to split the current region by looking at pixel value. Thus you can either just use the sobel filter image or you can use the grayscale image or combine them.

    Then on line 177 go ahead and change file name. You will get a path.json as result in your directory which you can upload on the website to view the result. You WILL need to tweak the parameters to find the best one
  • 0
    Looks like it doesn't honor edges enough.
    Or it was a picture of Mona Lisa behind bars.
  • 1
    @Oktokolo nah this is just automatically generated, i think people thought the auto generation is what I made but instead I just made the drawing board, the script is just a by product since I need to showcase it
  • 0
    any uploaded image -> rectangle art would be great, once you make it mobile friendly, share it on r/internetisbeautiful, they will love it.
  • 0
    @K-ASS
    Oh, the editor is crap.
    But the script and effect would be nice as a stylistic filter in GIMP or Inkscape (creating vectors from a bitmap there).
  • 1
    @Oktokolo not so sure about how to react to the editor is shit part
  • 1
    @K-ASS
    Make it a plugin for an editor which is not crap.

    Making a good graphics editor is pretty darn hard.
    But Gimp, Inkscape, Photoshop, Krita... exist. Lots of devs worked on them for decades to make them as good as they are now.

    For some reason, nobody seems to have tried to make an artistic rectangularization filter resulting in outputs like your interpretation of the Mona Lisa though.
    The unique part of your work seems to be the script.
  • 0
    Love the design! ❤️
Add Comment