Project Summary
Cozi UX Studio is an Austin-based UX accelerator agency that specializes in helping early-stage start-ups improve their user experience. In our first six months, we've formed partnerships with start-ups around the world, but we've struggled to find a platform that effectively connects us with potential opportunities.
Cozi’s Business Goals
- Limited bandwidth → Customer Retention > Customer Acquisition
- Partnering with start-ups → Attract investment for our clients
- Future growth → Build trust and reputation
Solution Highlights
THE PROCESS: Research & Empathy
While we have a general understanding of our business needs, we lack the qualitative insights necessary to build a website that truly serve our goal.
🔍 What I wanted to know
- What draws user’s attention on a UX agency website?
- Who is likely to visit the website and their reasons and purposes?
- How to help Cozi appropriately represent our partners and draw investments?
🔨 00 Research Methods Summary
- What are the actual insights that drives our design?
Comp Analysis (Baseline)
- What’s currently successful and could be improved
- Discover key website elements and design trend
Cardsort - Interview
- Let the users help me filter and organize the scattered information collected from the internet
- Identify personas, user-specific preference and scenarios to generate a suitable Information Architecture
Usability Validations
- Ad-hoc validations sessions with my stakeholders
- Every step of our design decision is usability tested and approved
01 Baseline Study - Competitive Analysis
Key Insights and Takeaways
Customer Retention vs. Customer Acquisition:
- Larger companies prioritize customer retention by highlighting their work
- Smaller companies focus on customer acquisition through CTAs and team insights
- Utilizing social media can build reputation and generate inbound leads
Design Trends:
- An effective user flow guides users through an intentional and streamlined journey, without relying solely on navigation menus
- Key elements of a reputable website for an agency: Clarity, Credibility, Consistency, Differentiation
- Effective customer-client communication starts with persuasive messages.
Hypothetical Solution Explorations
- Emphasize on
work examplesand social media insights - Individual page for
client and Partner’s summary and pitch decks
02 Primary Study - Card Sort:
I conducted the card sort activity via FigJam Post-notes by having the user move and categorize related card elements.
💡 Key Insights and Takeaways
- 80% of users found the "startups" content confusing
- Technical terms were only understood by those with prior UX experience, suggesting a need for clear language
- All participants found actual client work examples valuable
- Most participants trusted social media over the company website
- All participant agreed on the importance of showcasing service processes
- 50% preferred scheduling a call for a better interaction experience with the company
💥 The Pivot - Pitch Deck 💥
One of our initial hypotheses was to create separate sub-pages for each start-up partner, featuring their summary and pitch decks. However, feedback from card sorting and interviews indicated a lack of understanding of this approach. In order to effectively present our partners and generate interest, we have decided to:
Pitch Deck and all Client Company Summary as supplementary information within the case study page.DEFINE AND IDEATE
01 Persona
Combing the three personas and Cozi’s main business goal of customer retention, I decided to focus on The Investor and The Partner are the top priority for the website.
02 IA - Site Map:
The IA elements are decided to target more on “Service Examples” and “Company Insights”.
03 User Flow & Scenario
04 Design Principles
DESIGN EXPLORATION
01 Design Decision 1: Hide Top Navigation Menu
🚀 Based on baseline insights, we want to provide a purposeful user flow. Hiding the navigation menu lowers its visual hierarchy in a way that lead users to scroll down and see more content.
02 Design Decision 2: Move Contact to Footer
🚀 Based on our business goal, we know that our design should focus on user retention. Moving contact CTA to the footer gives user opportunity to understand our content first.
03 Design Decision 3: Leave a Message
📖 Because of the dark background, and lengthy explanations to each topics, we want to do our best to help user read our content without too much of effort. Which turned out to be quite useful through feedbacks.
04 Design Decision - Bionic Reading
🚀 Based on our interview insights, user prefer being contacted by us than sending out cold emails. Giving options to tag their interests and leave us a message allows a better prepared communication.
05 Validation - A/B & Usability testings
Agile validations for efficient iteration approvals
FINAL DESIGN
01 Design Screen 1: Home Page
- Navigation Menu Hidden
Easily accessible Navi menu
- Service Detail
Bold information giving a brief introduction on what Cozi does as a UX agency
- Featured Project
Visual draws user attention. Hover over images to active CTA to enter project details
- Insights
Blog and Podcasts available for access in the first glance
🎞️ User Flow 0.1 - Enters Home Page In below particular example, home page is designed to be simple yet uses small animations when scrolling to add interactiveness to the user.
02 Design Screen 2: Featured Case Study
- Featured Project
Visual draws user attention. Hover over images to active CTA to enter project details
🎞️ User Flow a.0.2 - Interested in featured case study (Scrolling Animation) In below particular example, projects with pitch deck included will be marked to help user decide which project to view. This decision is designed to meet the ask of different personas that may likely visiting the website.
03 Design Screen 3: Service Detail (Home page animation)
- Service Detail
Bold information giving a brief introduction on what Cozi does as a UX agency. A simple CTA button quickly leads the user to detailed page.
04 Design Screen 4: Team Info (About Us)
- About US
Showing the process of how Cozi tackles problems will likely increase the validity of the company services.
🎞️ User Flow b.0.3 - Interested in service details and team info (About us) In below particular example, user will get exposed to the services Cozi provide in home page. If they are interested in the details and learn more about how Cozi does these services, they have the ability to go into About Us page for more information.
DESIGN DELIVERABLES
01 Design System
02 Responsive Design - UX Handoffs
RESULTS AND IMPACT
#Takeaways
#NextStep
The research and prototype design allows the team to create a usable and useful website draft. However, a good design will require additional end-to-end validation testings when gradually being incorporated into development.
- End-to-end general studies will be conducted on the prototype to previously recruited research participants. The purpose of the study is to understand the intuitiveness of the prototype in the eyes of the actual users.
- The final development of the website will be put together in Webflow.
Read next:
Helping Local Business Regain Customer Engagement during COVID-19: a Community-based Social Platform
Want to chat? Let’s connect!