
Show HN: Screenshot.rocks – Create browser mockups from screenshots - dignite
https://github.com/daveearley/screenshot.rocks
======
httpsterio
For all commenters who do not see the value, these types of images are often
used in marketing. If you share a screenshot without a device, it doesn't
really look that good or marketable. The context and frame around the
screenshot simply looks more professional and stands out better.

Toi could always throw the screenshot into figma and use a plugin to generate
the images but this seems much simpler. As one commenter said, do one thing
well and this seems to do it.

------
ivarojha
Think I misunderstood the description. Correct me if I'm wrong, with this we
can add nice looking browser toolbar on top of the screenshot, right?

I was under the impression that once the screenshot is uploaded, the elements
in the page are extracted and can be moved around i.e. we can play with the
buttons, form fields, texts or any identifiable element that can be separated
by its boundary.

~~~
omk
Thats two of us.

------
yodon
You made a tool that makes screenshots but you don't have a single screenshot
on the site and you have an unviewable purple rectangle as the only "image" on
the git repo? I don't get your logic.

------
sixhobbits
I use BrowserFrame[0] fairly often for creating tutorial screenshots etc. This
looks very similar. Was it inspired by that?

[0] [https://browserframe.com/](https://browserframe.com/)

~~~
yodon
Do any of these tools support gif animated screenshots?

~~~
alyssaxuu
Self-plug but [https://animockup.com](https://animockup.com) does :)

~~~
yodon
Super - this will certainly come in handy at some point, though I was
primarily looking for browser screenshots at the moment (which I think your
animockup doesn't do today)

~~~
alyssaxuu
Awesome. And indeed, I do plan on adding more mockups + the option for people
to make their own (selecting the area where the video would be placed). It
seems like there is some demand.

------
namanaggarwal
Don't ne disheartened by the comments asking the usefulness of this. I have
been asked by lot of product guys to include browser in the screenshot so it
looks better in their presentation.

------
amelius
Everybody is doing screenshots the same way these days.

The only options missing are: show Apple laptop and cafe latte next to the
laptop.

------
erklik
I have possibly found a "bug". Not sure. Some websites, especially that take a
while to load simply won't have the complete screenshot. Here's an example,
the below link will only have the header in the screenshot without the header
image :

[http://www.tusifahmad.com/](http://www.tusifahmad.com/)

------
steventey
This is incredible! Love the simplicity in the UX design. Gonna post it on
Twitter in a bit - would love to tag you but I can't find your Twitter.

One suggestion - a way for people to share the link directly or just copy the
PNG file without downloading it will reduce friction for people who don't
really have space on their devices.

Great job, Dave!

------
chrismorgan
How am I supposed to paste? I put an image on my clipboard, and so far all
I’ve got by focusing all the focusable things and pressing Ctrl+V is the image
filling the fake address bar.

My attempts at dropping images (from the same browser) are also failing to do
anything.

Firefox, Windows.

------
butz
Would be nice to see more browser and operating system variations. Don't
forget mobile browsers.

------
frequentnapper
It says Drop, paste, or click to upload an image, but pasting doesn't do
anything.

------
onion-soup
So an entire tool to add “slick” macos browser top bar? Umm, thanks I guess...
lol

~~~
8organicbits
Do one thing and do it well. Seems useful and I appreciate the simplicity.

------
cybernabjo
Very nice, maybe there should be a way to change the border color.

------
imvetri
It's nice. Im curious to know how does it work?

------
elwell
Nice start; what are you plans for future (killer) features?

