CONTENTSIntroductionResearchProblemSolutionDesignPrototype
UX Case study

The Hitlist

Research

USABILITY AUDIT

competitor benchmarking

The bRAND IDENTITY

Ascend Consulting Group wanted a brand identity that was classic, professional, and simple. Below is the logo suite and color pallete I created for Ascend. The suite consists of a primary logo that gives detailed information like the founders and the brand values. There is also a submark for more subtle branding, as well as a simplified logo, secondary logo, and alternative mark.

Introduction

The Hitlist is an application that saves people time and frustration, by aggregating curated activities and experiences in the users area. Over three weeks I assessed the issue the app set out to solve via secondary and primary research, analyzed the competitor landscape, ideated the applications design to align with consumer needs, and finally created low-fi pro-types of the proposed product design.

timeline

3 Weeks

tools

Figma

Brand identity

I kept the brand identity simple and relatable. A style that carries throughout all brand assets. It was important to the client thay the visuals did not take away from the story telling.

Problem

There is an overwhelming amount of information to consider when looking for an activity to do. It becomes a timely activity. There are always new things popping up and old things going out of style.

SOlution

The Hitlist, a digital platform, that assists people in quickly, easily, and effectively filtering through experiences in various locations, so that they can spend more time enjoying the experience and less time researching.

Research

Research is one of the most important steps when creating a user experience. If you don’t understand the user you are trying to reach, what motivates them, and the challenges they are trying to overcome, it will be extrememly difficult to create an experience that is effective ans satisfying.

Competitve analysis

It was important before conducting primary research, to conduct secondary research on what platforms exist to solve the same problem, if any, and get an understanding of what these competitors do well and their pitfalls. The green notes represent strengths of each competitor, and the red notes detail opportunities for improvement.

sURVEY

After getting an understanding of the problem and the current competitors in the landscape, I created a survey to get information from potential Hitlist users.  I sent out a 12 question survey to 35 participants via social media.

Interviews

I conducted virtual interviews with 3 survey participants to get a deeper understanding of how they identify activities, gauge how they feel about their current process, and what users struggle to accomplish when planning activities.

affinity map

I took the interview answers and pulled out common themes that shined throughout all participant answers. These themes included current process, wants and desires, time value, and planning struggles.

Empathy map

From the affinity map above I created an empathy map that served as the foundation of my user personas.

pERSONAS

The two personas that emerged from the empathy maps were “The Avid Activity Planner” & “The Last Min Explorer”. The activity planner enjoys planning, she loves to make plans in advance to leave herself time to work on other things. This user would return to The Hitlist multiple times a week, creating a detailed list of experiences and activities to complete. She would share ideas with friends, and really exhaust all of the features within The Hitlist application. The last min explorer is using the Hitlist app when wanting to plan an immediate activity. They don't have a lot of time to research and need to be able to filter specifically and efficiently to find exactly what they are looking for.

Color palette

The color palette is comprised of a variety of cool tones to communicate calmness, and understanding.

Building the brand

To create the logo I combined the company name and glasses iconography. The logo communicates the companies values: individuality, playfulness, and customization.

Below are some initial logo exploration sketches, before settling on the final concept.

Web development

The web design for the Ascend Consulting Group website was pretty straight forward with the exception being the services catalog. This page took a little more UX design thinking to perfect. I detail the strategy behind that page below. All pages were built using webflow and a bit of custom HTML & CSS. Click below to see the live site.

view live site

THE SITe MAP & PAGE DESIGNS

The client was very clear about wanting a simple site with page layouts that tie back to one another. Below are the four pages I designed and brought to life using Figma and Webflow.

Services catalog

The most challenging part of the web design was the services catalog. I wanted to be able to display a long list of services in two categories (Business & Education) without over whelming the visitor. I developed an interface where users can hover over the name of the service in the selected category and detailed information on the service would be displayed at the top of the page. This eliminated the need for tedious scrolling that can lead to visitors losing interest, or moving on before they reach the service that appeals to them.

ePIDsODE ART & SOCIAL TEMPLATES

The thoughtful intentions podcast wanted templates that could be used for each guest to create some buzz across social platforms. I created an album cover like graphic that showcases an image of the guest, the episode title, and the release date. The second graphic is an introduction post to welcome the next guest before the episode is released. Finally I designed a graphic that could display a quote that is used during an episode or pertains to the topic discussed.

Social STrategy in action

Step 1 | exploration

Asking the audience what kind of guest they want to see and what questions they would like answered.

Step 2 | Introduction

These posts introduce the audience to the next guest and give some background on the episode.

Step 3 | release

This post lets the audience know that there is a new podcast available for listening.

Step 4 |  Reinforcement

These posts encourage listeners to connect with guests on a deeper level. The quote post alludes to meaningful themes discussed by guests, and the if you know you know post gives listeners a BTS view of each guest and their background.

other Marks

Brand Colors

The brand colors are variations of the three primary colors. They were chosen to convey a sense of customizability, and the idea of familiarity.

Ideation & design

After fleshing out the motivations and challenges of each user persona, I asked myself how might we serve the user by alleviating some of their struggles and aiding in accomplishing their wants and needs.

• How might we help people make plans easily and hassle free?
• How might we assist users in keeping track of exciting experiences?
• How might we help people find the specific kind of activities they are looks for quickly and efficiently?

bRAND pATTERNS

I designed unique brand patterns to be used across packaging, and other brand materials. The first being the most subtle. A zoomed in version of the original glasses design, that incorporates the primary logo. The second pattern uses the same glasses icon in a more dense arrangement. The third patter combines all of the brand logos and marks.

Packaging

Below is a demonstration of the brand patterns in action on physical packaging including, shopping bags, boxes, and cases.

Additional assets

In addition to the requested deliverables, I provided the client with a social feed mock up, business card design, and brand image direction.

site map & User Flows

Once I determined how we might serve the aforementioned users, I created a site map that included pages tailored toward the users specific needs. Recommended activities, a robust and efficient filtering system, as well as a place to save activities users are excited about.

sketches

These are the inital low-fi sketches for various pages within the application needed to complete the two user flows.

Lo - fi wireframes

User flow 1

User flow 2

REFLECTION

In the future I would love to extend this project and create a hi fidelity prototype for The Hitlist app. Even though this was an exercise in research, ideation, and wire framing, I believe it would be awesome to test this application with users, and see how they respond to the design. Along with the hi-fidelity prototype the exercise of building out the Hitlist brand and ensuring consistency across the hi-fidelity design would also be a great exercise.