8 ms·
Show HN: Screenstab – A tool to turn screenshots into image assets
- rbinv 6y agoCool idea. I wonder if the effect(s) could be achieved solely with CSS? edit: the page says the transforms are done locally, but maybe you could also offer a hosted API so screenshots can be replaced automatically.
- mikaelaast 6y agoHi, OP here! The depth-of-field effect is pretty much unattainable with CSS. I have toyed with the idea of an API as well, to sweeten the deal for subscribers (and also it would be neat as heck!).
- deleted 6y ago[deleted]
- dvh 6y ago"Before" contains information. "After" is stock photo fluff.
- sneak 6y agoPeople pay money for "stock photo fluff", as you put it.
- deleted 6y ago[deleted]
- mikaelaast 6y agoOP here: Yes. Not to mention how OCR-unfriendly it is... I don't know what to tell you. Screenfluff didn't have the same ring to it.
- darsoli 6y agoIs there only one transform option, or could you offer several? That might be a good way of satisfying those who want a very fancy looking image to others who want specific functionality (magnify certain portions of a window, etc).
- bennyp101 6y agoAh, it doesn't work on my Firefox :( > WebGL warning: <Create>: AllowWebgl2:false restricts context creation on this system Works fine on Chrome though, looks cool - couple of things; - I found the the scroll to move very strange to use, click and drag would be nicer - When I changed the blur intensity, it took over the mouse movements and used that to move the image rather than scroll - until I clicked on the image again
- mikaelaast 6y agoOP here! Dang it! What OS and version of Firefox are you on, if you don't mind my asking? I hear ya about the scroll, and that's valuable feedback. Are you using an actual mouse or a trackpad?
- bennyp101 6y agoLatest Firefox on Manjaro - pretty sure it's to do with with the graphics driver and Firefox not playing nicely (fine on Chrome) - so I wouldn't worry too much! (There's some webgl config settings I think...) Using a mouse, so the scrollwheel to move it seemed ... off ... but then changing the blur intensity made it do what I would expect (letting the mouse move the image) so that's all good! :D
- mikaelaast 6y agoOP: Invaluable feedback. Thank you :)
- tylermenezes 6y agoI'm using the same setup and no problems here! Maybe a problem with open-source graphics drivers? I'm using proprietary.
- dubcanada 6y agoI am guessing this has something to do with your OS or gfx card more then your Firefox. It seems the error is most likely due to something stopping WebGL initialization on your Firefox. On a brand new installation of FF dev on Windows it works.
- hahamrfunnyguy 6y agoPretty neat. What are some intended uses case for something like this? I've created similar content for a hero image before, but outside of that or perhaps as part of a video I am not sure how I would use this.
- neodymiumphish 6y agoYeah, this is my take as well. I plan on doing TryHackMe/CTF write-ups on GitHub/Medium/etc, but there's no way I would be using this at that price range for something like that, where it's maybe 3 images per post and one or two posts per month. Maybe I can get by with the free offering, though, but I'd like to make the screengrabs a bit more legible.
- pg5 6y agoYou could do single window screenshots and then use GIMP with some drop shadows.
- mikaelaast 6y agoOP here: That's <$1 per image :) I'd venture to say that's a good deal, any way you slice it.
- digitalgangsta 6y agoNice idea and i really like the simplicity! Could you provide other effects? If there was a range of different effects offered, using the same simple interface that'd be very cool.
- mikaelaast 6y agoOP here: Thanks, and great question! I really like the idea of it being a one-click thing. Adding features is a slippery slope...
- marcodiego 6y agoBack in the day we simply configured compiz switcher and got a good screenshot: https://upload.wikimedia.org/wikipedia/commons/f/f4/Compiz-ShiftSwitcher.png?1612969029810 https://upload.wikimedia.org/wikipedia/commons/f/f4/Compiz-S... Linked image is not as beautiful as reality was.
- sscarduzio 6y agoThis is really pretty. Thanks for taking the time to creating it. I concur with other users saying that it's strange to scroll to move: messy with trackpads, and what does it mean to move? Better provide an optional scroll bar that mirrors the scrolling, or can be manipulated directly with the mouse.
- mikaelaast 6y agoOP: Thank you :) So yeah, I gather that the scrolling is a bit unintuitive... For what it's worth, the up and down keyboard keys are mapped to the same motion, so they should be a good substitution.
- btbuildem 6y agoAh.. my go-to for this is to take a photo of the screen with my phone. The effect is spot on, and as bonus, you can capture the pixellated nature of the image.
- EForEndeavour 6y agoThe risk of horrible moiré comes to mind.
- mnw21cam 6y agoIndeed. There's even an xkcd for it - https://xkcd.com/1814/ https://xkcd.com/1814/
- o-__-o 6y agoFor those looking for a DIY solution, ImageMagick is the tool https://legacy.imagemagick.org/Usage/warping/ https://legacy.imagemagick.org/Usage/warping/
- detritus 6y agoImageMagick's neat, but the steps required to warp and then tenderly shadow and sheen the output of a grab are, in my experience, much better done (initially at least) with a GUI tool. A lot quicker to intuit, test and iterate. I hate the thing personally[1], but GIMP would likely be a better graphic manipulation suggestion, in this context. Of course, once you've worked out what you're after, and want to manipulate tens or thousands of images, ImageMagick's your wizard. . [1] I'd just download a trial of AffinityPhoto and use that
- tyingq 6y agoPaint.Net with the Shape3D and Drop Shadow plugins does pretty well. Definitely some learning curve, but nowhere like GIMP or Photoshop. And free like beer.
- NearAP 6y agoThanks for this. Was looking for a tool like this just about 2 weeks ago (for flipping and rotating images on the web; I saw [1] but it was for Shopify) 1. https://apps.shopify.com/flip-and-rotate-product-image https://apps.shopify.com/flip-and-rotate-product-image
- tyingq 6y agoThe typical 3D rotate using ImageMagick as a shell script: http://www.fmwconcepts.com/imagemagick/rotate3D/index.php http://www.fmwconcepts.com/imagemagick/rotate3D/index.php
- kareemm 6y agoFantastic idea. I've looked hard for a tool to make nicer product marketing screenshots without a designer and there are very few nice tools. The best I've found is Screely[1]. Couple suggestions: 1. Be able to add a magnifying glass effect to draw the eye[2] 2. Put in different browser chrome 3. Allow annotations and arrows that don't look like they were made with a quick and dirty screenshot tool 4. Allow resizing and cropping 5. If you want to get fancy, build an OS X app to take and edit the screenshot in one go. 6. Add drop shadows and other effects Paying for a tool like this above would save me so much time making product marketing screenshots and would be a no-brainer for me. 1 - https://www.screely.com/ https://www.screely.com/ 2 - like this: https://www.pixeden.com/media/k2/galleries/157/001-loupe-screenshot-magnifying-web-psd.jpg https://www.pixeden.com/media/k2/galleries/157/001-loupe-scr...
- mikaelaast 6y agoOP here: Thank you very much. That was my starting point as well, to quickly generate consistent and good-looking marketing material without involving a human, basically. Thanks for the thoughtful feedback and suggestions.
- nicd 6y agoAnother feature idea: be able to export videos with "focus pull" effect. I was editing a video earlier this week; would've been great to have a tool like this.
- O_H_E 6y agoUseful or not, that looks sexy. Bonus points if you can add a set of copy-able settings, so one can apply the same transformations to different pics potentially in different sessions.
- mikaelaast 6y agoOP here: I humbly thank you! Yes. Saving settings as well as batch processing of images are both on my roadmap.
- simplecto 6y agoThis is neat. Points for execution! I did this for the first iteration of my side-project using my camera to "take a photo of a photo". I did a side-by-side comparison of screenstab vs iphon6 taking pic of screen. original screenshot as control Here: https://imgur.com/a/urRmG2S https://imgur.com/a/urRmG2S WFH means we have time on our hands to do comparisons like this. LOL
- mikaelaast 6y agoOP here: Thanks a bunch! Your comparison highlights something that always bothers me about taking a real-life photo of a screen: the banding/moire effect resulting from the physical pixels being viewed from an angle. This was actually something I encountered early on in Screenstab when I was attempting to replicate the look of a real subpixel layout. Had to scrap that approach.
- simplecto 6y agoInteresting! You should put a side-car blog up and talk about the challenges and lessons that came from building this thing. I've been doing that and was able to ride the front-page of HN for about 18 hours. Link in profile. Also, I see that you are in Norway?! Hej from Sweden :-)
- mikaelaast 6y agoOP: I like that idea. And yes, I've noticed your posts. Hej, söta bror!
- woliveirajr 6y agoWhy stab the screen to get beautiful images?
- mikaelaast 6y agoOP here: Finally someone is asking the right questions... I don't know. Naming stuff is hard, and it was late at night.
- twobitshifter 6y agoI think it’s a cool product but the name is not something memorable for me.
- woliveirajr 6y agoThe product is very good but after I heard about "expertsexchange" I can't help noticing how URLs can have undesired consequences.
- WORMS_EAT_WORMS 6y agoJust want to quickly say congrats and awesome idea. Will definitely use in future
- mikaelaast 6y agoOP: Thanks :)
- op00to 6y agoNo idea what this actually does after reading the web site. Is there a gallery of examples or something?
- glsdfgkjsklfj 6y agoHere is something completely different: https://github.com/gcb/mk6 https://github.com/gcb/mk6 you can "write" (or even read) the screen shot in very simple HTML5 (soon markdown) and a CSS file will magically make it kinda-look like windows/gnome/kde/osx/ios/android. goal is both to have fully accessible "screenshots" in documentation and to ease the authoring for developers. Mostly because i was tired of having a VM with default vm themes just to create screen shots :)
- gegtik 6y agoThis is cool as heck
- mikaelaast 6y agoOP: <3
- Bob_LaBLahh 6y agoVery nice. I'd use it. Two ideas to consider: (1) give option for one time purchases (2) raise your price (I'd pay more) Good luck!
- michaelmcdonald 6y agoThis. So much this. I'm sick and tired of subscriptions for software. The fatigue is real.
- fudged71 6y agoA while back I saw a way to take an SVG screenshot of a webpage, which seems like an excellent intermediary format if you are warping text etc and not wanting to run into aliasing problems etc. Is that what you are doing?
- m3kw9 6y agoThe mix of seller, buyer and “you” in the writing makes it hard to follow who’s who sometimes.
- markhall 6y agoThis is great concept with a strong execution. Interested to see how the price-point resonates relative to typical frequency of use.
- endisneigh 6y agoI’d rather pay $100 once and have this on my computer permanently. Any chance of that happening?
- kinard 6y agoWell done, seriously well executed.