Roket Designed and Developed a Multi-City Crowd-Funding Platform for STEM Education
The Beginning
You can check out a full case study of this branding and web design project in our portfolio.
A startup veteran and space enthusiast, Richard Behana, approached Roket with his concept for a multi-city crowd-funding competition to benefit STEM (Science, Technology, Engineering, and Mathematics) education. Each city, including Pittsburgh, competes to raise the most money. The top city will be granted the opportunity to build a payload concept to accompany the next moon bound SpaceX rocket with Astrobotic, a Pittsburgh-based space robotics company.
Original meeting notes
Project Requirements
To launch this new venture, Richard needed:
- An attractive and compelling brand
- A multi-city crowd funding platform
- A helpful marketing website
- Marketing collateral including infographics and presentations
- Donation incentives including mission patches, t-shirts and pens
The Constraints
Budget
As with any startup, finances are tight. Roket’s experience allows us to take on projects like SLC knowing our ability to do good work fast will set our client up for success—on any budget.
Technology
Roket needed to create a solution that gave SLC the ability to raise money in a crowd-funding environment. This challenge was made easier with frameworks. These help developers speed up integration and customization. Choosing the right technical implementation, accompanied by agile mindset, is key to a successful, efficient solution.
Brand Identity Development Process
Identity sketches to rough-out concept
We think about brand development holistically. At every touch point of user engagement—we want a consistent presence. This approach helps broadcast and cement a reliable message, personality and purpose in market.
A major component of a brand is it’s identity or logo. The brand identity we developed for STEM Lunar Challenge pays homage to the old mission patches which were uniquely created for each space mission. With it’s crest shape and launching rocket, the mark has an energy and purpose. This emotion is also conveyed in the bold color palette which references the 4 colors most refer to when visualizing STEM. 
Along with the visual representation of the brand, we also considered the verbal attributes. These were developed to speak to the aspirational aspect of space travel and the empowerment of education. Slogans like “Moon Bound,” speak directly to the purpose and emotion behind the challenge.
Visual Design Process
Website wireframes
The visual design starts with the foundation of the website structure, showcased above with our original wireframes. Wires are the “blueprints” for websites and are created in order to plan out the site’s content structure. Most of the time, imagery is excluded, but for this exercise, we thought it was important detail to provide since the header of the site was dependent on images.
“Roket was a great company to work with. They not only created a great platform for our company but an awesome brand! We constantly hear how great the site looks. They were extremely professional and worked diligently to meet our unique needs. I would highly recommend using Roket and plan on using them again in other projects.”
Richard Behana
Founder at STEM Lunar Challenge
After internal and client review, we then apply the visual style and refinements that result in a completed design. For the SLC project, the style was built around the bold color choices and illustrated style initially established with the logo. It is accompanied by historic images from various NASA moon missions which help to bring additional aspirational context to the site.
Project Homepage
Web Development Process
Front End Code
The website we created brings together a unique combination of Bootstrap, Shopify, Mailchimp and Amplifier. We chose Shopify as the eCommerce platform and payment gateway due to it’s ease-of-use, but more importantly, for it’s a killer templating language called Liquid. Liquid is an open-source, Ruby-based, language created by Shopify. We combined Shopify with a powerful, mobile first front-end framework called Bootstrap to mock up our original wireframes. We then combined Shopify and Bootstrap to create a template that can be used for our current pages and future pages to keep the project flexible.
On top of eCommerce, the other component of STEM is education. We created a dedicated education page, with a signup form powered by Mailchimp to have students and educators alike sign up for inclusion in the program.
Finally, we used Amplifier, a product distribution service, to make sure that donations to the challenge were shipping on a timely basis.
We are really excited to have been a part of this initiative and would love to hear any feedback or thoughts on our process or work.