Untold Labs kicked off the new year by pushing CSS3 and HTML5 to new creative boundaries. Our task was quite simple: create a game, book, utility or a music video using one or both emerging tools and make a minimal viable product as proof of your concept. We were limited to creating a web app or mobile website for a smart phone or a tablet — design focused on one or the other. The real catch is the deadline. Can we design and develop two separate apps in less than three hours?
Kings Mountain State Park (Interactive Mobile App)
State Parks can still make brochures with printed trails, activities and historical tidbits. But what if you could place all of that info into a mobile app that still makes you feel like a nostalgic explorer? A westward pioneer? Our Motion Graphic Designer Eric Kramer asked us to transform beautiful printed design into an interactive experience — complete with animated maps and pages — without losing that sense of holding a guide in the palm of your hands.
Kramer gave us design assets that he had created and a speculative product video to show our teams how the final product would appear. The contents would have “swipe-able” copy; navigation would appear as if they were printed in a brochure and our latest technologies would help curious adventurers truly explore a State Park in the digital age(GPS-navigation and ultimate mobility). The design required the use of CSS3. And CSS3 can be a developer’s ace, if he can harness the benefits of using less code and going without table-based design. In under three hours, we were able to upload a basic iPad app using CSS3 to flip between pages of the digital brochure and a utility any trekker could appreciate.
Once Upon A Tree (Interactive Children’s Book)
Parenthood leaves behind an experience some may want to forget. But who wants to forget those children’s pop-up books? Little paper wings and trees and dots meet your face as soon as you open the pages. A few of our crew members pitched the same idea: Let’s make it interactive and let’s put it on an iPad.
We created our own children’s story and using touch we let children interact with the story. Our developers created buttons out of the design (leaves on a tree) using CSS3 and HTML5. The overall experience would lead children through the narrative by asking them to interact with the iPad through a voice over. The ultimate app or web app experience would let any child see a book animated to life and experience a story truly driven by their own tiny hands.