iBEAM specializes in high-def cameras for construction site monitoring and archiving, and Image Archive+ was originally created to replace an aging Flash application that allowed users to log in and view their images. The primary requirements were a crisp image viewing experience, easy navigation over months or years of archived data, and quick filtering to see changes over time. As the primary interface for their customers to use, it also had to be rock-solid and highly performant. After a couple iterations and user feedback, we settled on a version that was easy to use and kept customers happy.
This was a full-stack application, with the front-end distributed on an AWS CDN, Node.js Express servers housed on EC2 (both for a REST API and an on-demand timelapse movie file generation service), and DynamoDB as the data store. Grayscale developed the table schemas, JWT authentication, S3 object retrieval, and server deployment and monitoring all in-house. In the end, this stack made the application up to 10x faster than its predecessor.
Screenshots
The sign in interface.The primary interface gave users a large view of the most recent image captured, with menus and tools for accessing more functionality. The arrows in the upper-right navigated to the next or previous image, and the slider offered a way to zoom into the image (the user could also use the scrollwheel).Clicking on the cameras menu at the top let the user switch between all the cameras available for them to see.Using the calendar and tools menu, the user could quickly navigate to an image taken at a specific date and time, as well as download, email, or print an image.The email tool made it easy for users to share what they were seeing without having to download and distribute it themselves.The bottom timeline menu showed a chronological overview of the camera's images, along with filtering options.With projects that could go on for months or years, it was important for customers to be able to filter and see a subset of their images. Using the filters in the timeline menu, they could select an interval such as "daily," and see just the images taken at a certain time each day.In addition to live camera streaming and control (not shown here), Image Archive+ offered an on-demand timelapse generation interface. The user could specify their parameters, and then hit "Load" to instantly queue up a preview in the browser. If they liked what they saw, they could fire off a request to the rendering server to compile the images into an HD or 4K movie file, which would later be available for download.
