"The Road Less Travelled"

"The Road Less Travelled" - student project

This is my first project in the UI/UX world. I am looking to transition from my job as a Digital Art Teacher into a Graphic/Visual Design role. While I was applying I was told to consider learning about UI/UX to broaden my skill set. 

I wasn't able to come up with an problem very easily so I took one of Maddy's and I think I was able to come up with a good idea from it. 

My hypothesis was "If a Young Person had a way to map out their routes, taking them on the "road less travelled" they would be able to learn more about their neighborhoods and feel more like a local"

"The Road Less Travelled" - image 1 - student project

I started out with the empathy map and haven't gotten into the wireframing but wanted some feedback to see if I was headed in the right direction. Any feedback would be appreciated!

 

Empathy Map

"The Road Less Travelled" - image 2 - student project

User Flow Diagram

"The Road Less Travelled" - image 3 - student project

Sketches

Screens when you first open up the app."The Road Less Travelled" - image 4 - student projectAddress input Screen"The Road Less Travelled" - image 5 - student projectDetails about your trip"The Road Less Travelled" - image 6 - student project

Select what you want to see

"The Road Less Travelled" - image 7 - student project

Maps"The Road Less Travelled" - image 8 - student project

 

Wireframes

(Low Fidelity In Figma)

"The Road Less Travelled" - image 9 - student project

Started creating general wireframes for my project. This was the start but after some feedback from some friends and other eyes it did change a good amount. The basic idea is still the same but I tried to make the process more streamlined and cleaner. 

 

Mood Board

"The Road Less Travelled" - image 10 - student project

"The Road Less Travelled" - image 11 - student project

 

Wireframes

(High Fidelity In Figma)

"The Road Less Travelled" - image 12 - student project

After creating the mood board and determine fonts I started to create the high fidelity wireframes and this is eventually what I ended up with. There were a lot of changes that eventually happened in the end but overall I am pretty happy with how the app ended up. 

 

Changes

"The Road Less Travelled" - image 13 - student project

One of the major changes I made after getting some user testing was to decrease the amount of inputs the user needed to make to use the app. At first I had the app designed to that you need to click 8 times just to enter your starting and ending address but after feedback learned that a smartphone can usually automate the location so I trimmed it down to 2. Also, the details for the trip took 6 clicks but again I reworked it to be a simple slider instead. I'm glad that I made those changes and made it simpler to use. 

 

App in Use

Here is the final video of the app in use!