Streak

Manage sales and customer relationships directly inside Gmail.

Background

While I was interviewing to work for the Streak team, I was given a 10-hour paid project as a part of the process. I worked directly with the Streak team on a couple key problem areas pertaining to their website, where I did an analysis of it's current state and made several important design recommendations.

Project Details

1. Landing Page

An audit of their current landing page was needed, and a refreshed version was requested.

2. Information Architecture Diagram

Content had been added to the existing site structure incrementally over time and the Streak team thought their information architecture needed a revamp.

3. Navigation & Footer

Using the insights from the IA diagram, I recommended a new way to organize their navigation menu and footer that prioritized user education.

4. New Integrations Page

The Streak team wanted an initial design for a new page on their website that showcases their integrations and automation features.

Landing Page

Old Streak Landing Page

New Streak Landing Page

I did a full breakdown of my audit of the old Streak landing page and how those findings resulted in the decisions I made for the new landing page. Check out the video walkthrough below:

Information Architecture Diagram

Simplified Version - Current IA Diagram

Visual Version - Current IA Diagram

Recommended Version - New IA Diagram

I walked through the simplified and visual IA diagrams I made based on Streak's current website as well as my recommended IA diagram, which served as the basis for my recommendations within the next section for the navigation and footer.

Check out the video walkthrough below (timestamps from 0:19 - 12:14):

Current Streak Navigation Dropdown Menu - Product section

New Streak Navigation Dropdown Menu - Product section

Using the insights found from my current IA diagram analysis, as well as my recommended IA diagram, I reorganized and redesigned both the navigation and footer menus in an effort to better familiarize users with Streak's offerings.

Check out the full video walkthrough below (timestamps from 12:14 - end):

Review the Figma here

New Integrations Page

Quick Wireframe for New Streak Integrations Page

New Streak Integrations Page

In the final part of the project here, I show the full process from organizing the content via wireframe to designing a high resolution mockup, explaining why I made the decisions I did along the way. Spoiler alert - I even went so far as to spin up a quick live Webflow site to showcase the design and my web dev skills.

Check out the video walkthrough below:

Review the Figma here

Thanks for checking out this project! 🤠

Back to home