Travonde

UI/UX Designer and Front-End Engineer

Travonde

Contract/Internship

Dec 2019 - Aug 2020

Background

Travonde is an app that allows anyone of any age to use. Today's leisure and Activity platforms cater primarily to millennials. However, 90% of baby boomers travel domestically and spend $26B annually on local leisure activities in the US. This is where Travonde comes in.

In our application, we provide activities that cater to baby boomers and their families. We're building an inclusive community for everyone of any age group to enjoy.

Problem

A lot of the designs are catered to millennials and the younger generations. This website’s target audience is for generations after millennials and so the website should be easy to navigate through and simple for all ages. The text and font should be clear and have information ready for users to navigate through and book. It can’t have complex UI and hidden features, but needs to also look good and be responsive. How can we make the website easy to navigate and get information for all generation?

Solution

First, the homepage should include everything that the user needs, like a search bar and featured events recommended by Travonde and city partners. This should be scannable so there’s no issue.

Homepage


Search bar

The previous iteration of the search bar was a search bar at the top, but I decided to make it a banner and have a floating card on the right side with drop-down menu inside. Also, the logo of Travonde would be on the left side.

Event Cards

The event cards I decided shouldn’t be a rectangular card, instead the pictures should have a round image and the information below should try to include the minimum a person should know about the event.

Each information should have an icon if necessary, like the location and type of event.

Like any standard event, it can also be shareable.

It lightens when hovered over so that it shows user that it is clickable.

Results

The design was a success and delivered what our users wanted in the website from the previous iteration. The next steps is in process and I implemented a part of the front end in React and CSS before my contract ended.

Check out the full design

Click here for Adobe XD Link.

Learnings