For my second Google UX course project, I was tasked with creating a responsive web design. I decided to create a career coaching app for first generation immigrants which I called New Horizon.
The goal of this project was to create a responsive design, using top down designing. I started by creating a web page for a large screen (desktop) and went on to adapt this to a mid-size screen (tablet) and ending with the smallest screen, meant for mobile usage.



Tablet
Mobile
Web

We needed to figure out the easiest way for users to simulate the calculation while making it interactive and fun to use.
Initially, I designed the calculator with a drop down menu, however, we wanted to make it more interactive and fun to encourage users to test out the calculator.
Why a slider?
The slider takes up less real estate on the page which was important when choosing how to present the calculator. It also provides more immediate visual representation of the value which allows users to quickly grasp the scale and current value at a quick glance. It's also more intuitive as supposed to a drop-down.
Metrics within the calculator…
We decided to include other metrics along with the Net Placement Value to give the users a better understanding of how the calculation is created.


Challenges