Screensnaps - Automated Screenshots for a Digital World
While working on Beer Memories, Chris Betz and I were looking at services that allowed for simple HTML/URL content to an Image, to generate the sharing functionality for each sharing card. We discovered a few things:
There were not a lot of services that provided this, in a simple restful API
The ones that did exist, were pretty expensive for a small idea like Beer Memories
As we researched more, we decided to build our version of these HTML to Image, using a product called Puppeteer. Puppeteer is Headless Google Chrome variant that allows you to take screenshots and view webpages in a native chrome browser. It was super easy to take screenshots and made developing a breeze as the CSS was all captured in Chrome, no need to use-hacky solutions to get the page to render. While I was working at Untappd, we used various services for this, but they never fully supports flexbox or floats CSS properties. Since Puppeteer was a regular browser, operating in headless mode, it made development of templates a lot easier, instead of having to fork code to render them differently.
However, we struggled with implementation of using Puppeteer in a serverless environment (with Lambda on AWS). There were delays in generation due to a cold start, countless different packages to install and if you used Puppeteer in your JAM Stack (like NextJS), you would need to handle the Chrome install path. In addition, setting up a simple NodeJS server on Elastic Beanstalk seemed to be a challenge in configuration of the right instance size, and auto-loading the Chrome package. There were some great workarounds to combat this, that I will explain in a future blog post. After all, you don’t want to have to manage your own service to handle these features, it’s primed for a third-party service that is fast and affordable.
After spending many weeks around this issue and finally being able to solve it internally for Beer Memories, we decided to create a service that allows developers of all sizes to use one simple API to get back fast, high quality screenshot images via HTML or URLs.
So today, Chris and I are beta launching a new service called Screensnaps! Screensnaps is a simple, high performance, automated screenshot developer tool that enables you to take screenshots fast via HTML or URLs, built off of the Puppeteer system. No need to configure a specialized NodeJS server for performance, we take care of that for you! Do you only need to use it for a few projects, but want enough legroom to grow? Our free account gives you 1,000 free screenshots per month for you to play around. The closest competition charges $14 per month for that plan, and you get all the features for free. We even support custom CSS and fonts (yes, Google Fonts). You can sign up today for free, and start taking screenshots in a little as 30 seconds. I know that’s a catchy slogan, but it’s actually true!
Screensnaps Features
How do we keep our costs lower? We use small server instances and only retain your images for 30 days, but you are welcome to download the images and store them on your CDN or Image Hosting service. We wanted to create a simple way for developers of all sizes to get started for free. If you need more than 1,000 screenshots, we offer a professional plan at 5,000 for $19 a month, where the image URL never expires. This also gives you additional features like auto-scrolling full page screenshots and high resolution (2x,3x) snaps as well.
Screenshot of the Documentation Area of Screensnaps
Why would you need something like this? Well you can use screensnaps for many situations, like generating in-app content that is dynamic for sharing (like a customized High Score Image with their score and image), virtual conference digital badges, QA visual validation and so much more. Check out our use-cases page for examples!
So if you are converting HTML to Images, and need a quick and easy solution, sign up for free at screensnaps.io. We have all the documentation there to get you started, as well libraries for Ruby, PHP, NodeJS and Go.
If you are interested in a paid plan, you can 50% off your first month with the promo code LAUNCH50. Chris and I would love to hear your feedback on what you think, you can let us know via Twitter at @screensnapsio or at support@screensnaps.io.
