top of page

Accelerating Careers: Ampersand

amp_main.png

My Role

• UX Designer
• Led Project Management

Timeframe

2 weeks

Tools

Figma
Trello

Team

4 UX Designers

Overview📚

Context

Ampersand is a company based in Texas aimed at eliminating the education to employment skills gap by connecting aspiring professionals and high-growth businesses.

Problem

Ampersand has multiple audiences, but it’s very difficult on the current website to speak to everyone without speaking to no one. How can we help with that user experience for the main two audiences (young professionals and businesses) and what's the right way to communicate all of this?

Solution

We will focus on redesigning a strong landing page that targets both aspiring professionals and high growth companies to better communicate who Ampersand is and what it offers to its target audience.

The UX Process

Discover🔍

Discover🔍

Survey Findings

14 participants | Ages 16-30 | 9 female, 5 male
My team and I created a screener survey to recruit user interview participants and find the following findings:

64.3%
feel unprepared joining the professional workforce

92.9%
are currently looking to strengthen their job skills

64.3%
noted the biggest challenge after graduation is lack of professional experience

User Interviews

10 interviewees | Aspiring Professionals | Virtual
The empathy map highlighted the essence of the project and why it’s so important to communicate the opportunities offered on the Ampersand website for the benefit of aspiring professionals.

ampersand_empathymap.png

Card Sorting

In order to test if the current navigation bar was clear and intuitive, we decided to conduct a cart sorting exercise. We found that there was only 42%, 35% and 30% agreement on the current categories which suggested that modification on the navigation bar was also needed.

card sorting.png

Usability Heuristics

Additionally, we created a usability heuristics in order to evaluate the learnability, efficiency, memorability, error management and satisfaction of the current Ampersand landing page to pinpoint areas for improvement.

ampersand_uh.png

Define✏️

Define✏️

Persona

Based on our primary research findings, we were able to make a persona of an aspiring professional and proto-persona of a recruiter to base our design decisions on.

Journey Map

Building on the aspiring professional persona and usability test on the current website, we were able to create a journey map of the process it would take for an aspiring professional to scroll through the landing page of Ampersand’s current website.

ampersandjourney.png

Site Map

Before sketching out what we wanted to include in the main navigation, we recreated a site map using the card sorting exercise to guide us.

sitemap.png

Ideate💡

Ideate💡

Sketches and Wireframes

Based on our research findings and synthesis we proceeded forward to ideate our ideas through sketching and wireframing. We each sketched out a landing page to combine certain sections or features we wanted to include in our design.

sketch_wireframe.png

Style Guide

We changed the color palette to focus more on darker blues and green to highlight dependability, trust, reliability, and calmness, with a pop of some lighter colors for contrast.

amp_styleguide.png

Prototype🖥 & Test🔁

Prototype/Test🔁

Iterations

Based on our second client meeting and second usability testing we were able to make the following changes.


​In our second client meeting, our client wanted:

  • Replace the images on the hero section with cartoons to match the harmony with the next two sections

  • Change the CTAs from red to another color because the red seems like an error

  • Redesign the application process so that both steps converge

  • Replace the weekly information session section with a more engaging calendar

Based on our second usability test on the version 02 of our design, we found:

  • The calendar section caused confusion and users were overwhelmed by the buttons on the side

  • Users wished the FAQs were located at the bottom of the page

iterations.png
Final Design✨

Final Design✨

Scroll at your own convenience to see our final design! 

ampersand_mockup.png
Conclusion😊

Conclusion😊

We were super happy to work with our client, Allie and work as a team to collaborate and create a functional yet visually appealing design for a company with a big purpose. Overall, it was a fun project where we were able to practice talking to clients, define the scope of work and work with teammates to help connect aspiring professionals to high growth businesses in the long run.
​
In the future we plan to:

  • Conduct a A/B test on the landing page

  • Build out the rest of the pages for businesses and aspiring professionals and test to see their efficiency in completing usability tests to ensure that the targeted audience could take an advantage of Ampersand efficiently

  • Create a responsive version of the design

bottom of page