SUMMARY
iOverlander is a traveling app for travelers (and is a nonprofit project operated by volunteers). Users can create new locations on the map as well as add details for each place, including amenities, photos, date last visited and GPS coordinates.

‍TYPE
Personal project

TIMEFRAME
Jan. 2020 - Mar. 2020
‍
TOOLS
Figma, Photoshop, Illustrator
‍
TEAM
Michael Tewasart (UI Designer & UX Researcher)

TAKE AWAY
The goal of this design was to create a more intuitive and easier user experience, integrating common UI elements from its competitors as well as address user feedback and reviews. I certainly learned a lot from user reviews and user testing.

As this app continuously gets updated, more fine-tuning and updated will be required.

MY UX PROCESS
I used the above research methods as I feel this process is the best way to accumulate quantitative & qualitative data on users and competitors. In turn this will guide my designs with research & evidence.

SURVEY
In the beginning, I conducted a survey with numerous friends, colleagues, and Reddit-users (11 total  participants). Such a survey allowed my to forge a rough path for redesigning the app and gave me a better understanding of people who use these apps - what are they trying to do, who are they, and what devices are they using? Findings include:

MOBILE PAIN POINTS
Conducting numerous user interviews prompted me to do an analysis of the app store reviews (both positive & negative ones). This was instrumental in solidifying what were the primary issues that users faced when using the app. Multiple pain points included:

CAMPSPOT
While this app does possess a search function as well as a map view, the map view is only available after a search is completed. Also, the app is mostly geared towards setting up camping trips towards resorts, trailer parks; etc. It does not search for simply amenities in which campers can simply go. As a result, it lacks the option for users to add in their own experience.

THE DYRT
This app also has a search function as well as a map view, but the map view is only viewable underneath a hamburger menu or if you choose the option "Near Me" on the dropdown. Users can also plan their routes towards their destination and earn points for prizes. However, certain features are locked behind a membership fee.

HIPCAMP
Features a UI interface that's incredibly similar towards Campspot such as using cards to display camping spots. Only a few minor differences such the ability to conveniently switch between map view and list view.

FEATURE PRIORIZATION
While this app does possess a search function as well as a map view, the map view is only available after a search is completed. Also, the app is mostly geared towards setting up camping trips towards resorts, trailer park

PERSONAS
Creating a user persona was essential in grounding my design goals that would meet the needs and expectations of the people I surveyed.

ADDRESSING THE ISSUE
The most significant change was the main menu. The previous, old design had the user choose between 6 options. Not only was this not visually engaging, but the 2 sections "List" and "Check-in" led the user to the same page, but only offered a continuous workflow if they arrived from "Check In".

The new design addresses by having "List", "Check In", and "Map" displayed on the same screen. As most user reviews were sampled from Google Play, the Explore Tab for the new workflow would match Google Maps, as I didn't want to break a standard design that I assume nearly all iOverlander users are accustom to.

Not only does this give users a sense of direction and position on where they are in both real time and on the app, but it clearly communicates which action the user should take with new branding and hierarchy.

BRAINSTORMING SESSION
A massive redesign of this undertaking required extensive sketches that would help me guide my later designs.

BRANDING
The color orange is used to provide a cohesive visual identity. The font Cabin (bearing a similar visual design to Comic Sans) has been selected as it possesses both the fun, spontaneous spark of adventure/camping and formality with its lacking in serifs.

The icon colors are carried over from what's currently on the app.

BRANDING
The color orange is used to provide a cohesive visual identity.

The font Cabin (bearing a similar visual design to Comic Sans) has been selected as it possesses both the fun, spontaneous spark of adventure/camping and formality with its lacking in serifs.

USABILITY TEST
It was time to validate my new designs with real users by conducting a Usability Test. Objectives are:

SHORTER STEPS FOR ADDING NEW PLACE
The steps for adding a new place (that follows the criteria) have been reduced from 9 to 5, as there was a request to have all the Site Info be inputted in 1 page.

CRITERIA WARNING -> POPUP
In the beginning, the first step was a criteria warning that showed up every time a user wanted to add a new site. Users found this cumbersome as it was mandatory and couldn't be skipped. The redesign makes it into a pop-up, with the option to not have it display it again.

UI ELEMENTS REPOSITIONED
Most of the users wanted immediate access to their GPS location (and the ability to change it on the fly), so I moved it from the settings page to the explore page. I also moved the filter button down to the lower right so the right thumb button can reach it even more.