EMBARK!
view the code on github
About
Embark! hosted on Heroku, is a tool geared towards career-changers who don’t know where to start.
For my final project at The Iron Yard, myself and another designer on the front-end along with a developer on the backend, decided to build a solution to address the challenging problems and opportunities we faced as career changers. Having just gone through this difficult and complicated process ourselves, our goal was to make this transition easier and more approachable.
We had three weeks to take this project from research and discovery to the final live, coded version. We worked in an Agile environment, conducted daily stand ups and used Trello for project management - task breakdown, blockers and daily progress. We kept the focus on the user's needs and behaviors and spent the first five days on user/design research and interviewed six career changers. We analyzed our data and findings, crafted personas and identified three main problem areas to address. We then proceeded with sketches and wireframes and validated its usability through peer review. Once validated we continued with branding, prototyping, coding and integration with the backend. We spent the final week ironing out integration issues and focusing on functionality and user testing. Through research, feedback and design iterations we were able to create a solution that not only met our user’s needs, but also anticipated opportunities to make the user experience more useful and efficient.
Features
1. Industry suggestion quiz
2. Company culture ratings and location preferences
3. Tool that takes industry suggestions, culture ratings matches and location preferences and outputs real-time job listings from Indeed based on must-haves drawn from Glassdoor data
Goal
To create a smart, modern, clean, inspirational and exciting site/tool geared towards career-changers who don’t know where to start.
Technology / Tools
HTML5, CSS3, Sass, Javascript, jQuery, Sketch, Illustrator, Trello
Design Process Examples
Process
1. Trello board for task breakdown, team member assignments and deadlines.
2. Research, brainstorming, design discussions - wordlist, SWOT and website analysis, competitive market study, persona creation.
3. Wireframes in Sketch
4. Branding - used styletile as a guide. A unique theme, with color pallette, typographic treatment, inspirational patterns and images.
5. Logo design
6. Mockups using the finalized wireframes and styletile
7. Code using HTML5, CSS3, JS and jQuery.
8. Early integration with backend.
9. Usability and user testing.
Challenges
The main challenge we faced was making the website feel modern, trendy and exciting while simultaneously feeling trustworthy and authoritative. We achieved this through a consistent grid, bold colors and a clean interface. We also ran into several integration issues but were able to work though them cause we had alloted sufficient time for integration and usability testing.
Selected Screenshots
