Screenshots

I wrote about how I created a page on The Session with instructions for installing the site to your home screen. When I said that I included screenshots on that page, I may have underplayed the effort involved. It was real faff.

I’ve got an iPhone s…


This content originally appeared on Adactio: Journal and was authored by Adactio: Journal

I wrote about how I created a page on The Session with instructions for installing the site to your home screen. When I said that I included screenshots on that page, I may have underplayed the effort involved. It was real faff.

I’ve got an iPhone so generating screenshots (and video) from that wasn’t too bad. But I don’t have access to an Android phone. I found myself scouring the web for templates that I could use to mockup a screenshot of the address bar.

That got me thinking…

Wouldn’t it be cool if there were a service that generated those screenshots for you? You give it a URL, and it spits out screenshots of the site complete with overlays showing the installation flow on Android and iOS. It could even generate the img markup, complete with differently-scaled images for the srcset attribute.

Download the images. Copy that markup. Paste it into a page on your site. Boom! Now you’ve got somewhere to point your visitors to if you’d like them to install your progressive web app.

There are already some services out there for generating screenshots of mobile phones but they’re missing is the menu overlays for adding to home screen.

The devrels at both Google and Microsoft have been doing a great job of promoting progressive web apps. They’ve built tools to help you with tasks like generating icons or creating your web app manifest. It would be sooooo nifty if those tools also generated instructional screenshots for adding to home screen!


This content originally appeared on Adactio: Journal and was authored by Adactio: Journal


Print Share Comment Cite Upload Translate Updates
APA

Adactio: Journal | Sciencx (2022-01-20T15:22:43+00:00) Screenshots. Retrieved from https://www.scien.cx/2022/01/20/screenshots/

MLA
" » Screenshots." Adactio: Journal | Sciencx - Thursday January 20, 2022, https://www.scien.cx/2022/01/20/screenshots/
HARVARD
Adactio: Journal | Sciencx Thursday January 20, 2022 » Screenshots., viewed ,<https://www.scien.cx/2022/01/20/screenshots/>
VANCOUVER
Adactio: Journal | Sciencx - » Screenshots. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2022/01/20/screenshots/
CHICAGO
" » Screenshots." Adactio: Journal | Sciencx - Accessed . https://www.scien.cx/2022/01/20/screenshots/
IEEE
" » Screenshots." Adactio: Journal | Sciencx [Online]. Available: https://www.scien.cx/2022/01/20/screenshots/. [Accessed: ]
rf:citation
» Screenshots | Adactio: Journal | Sciencx | https://www.scien.cx/2022/01/20/screenshots/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.