KSU Design-A-Thon: Designing Siftr’s Website
SIFTR WEBSITE DESIGN
Figma, Webflow
TIMELINE
Mar 2024 (1 Week)
TOOLS
ROLE
Product Designer
PLACE
1st Place
Creating Siftr’s Landing Page
Overview
At Kennesaw State University's 2024 Design-A-Thon, I teamed up with Christine Taylor and clinched 1st place by tackling Siftr’s challenge: Design the landing page of their site with the main purpose of getting users to download the Siftr app. In just one week, Christine and I designed and developed a landing page for both web and mobile that effectively directs users to download the Siftr app while establishing a strong brand image and a compelling hook to give users a reason to download the app.
Design-A-Thon Kickoff
What is Siftr and How Do We Direct Users to Download Their App?
What Is Siftr?
What Will We Be Designing?
On the first day, the sponsors from Hatchbridge Incubator kicked off the event in a presentation to go over the challenge we would be solving in detail. My group was assigned to design a landing page for a start-up called Siftr. In their presentation, they went over what Siftr is, who Siftr is for, and what we would be designing for them.
Kickoff Presentation
Siftr is a mobile app designed to help TV and movie watchers find and decide on titles that fits their taste. Siftr utilizes its “archetype quiz” to offer users personalized recommendations and connects them with others who share similar tastes, facilitating their search for the next thing to watch.
Siftr App Mockups
For our design challenge, we were tasked with designing a landing page for their website that effectively communicates brand messaging while accomplishing the pages main goal of directing users to download the Siftr app.
The messages the founders of Siftr want the page to communicate are as follows:
Siftr efficiently sifts through the overwhelming content landscape, saving users from the frustration of wasting time settling for mediocre titles.
Siftr serves as a guide, not the hero, swiftly directing users to content they'll truly love.
Siftr enables users to dive right into watching something they'll enjoy without the hassle of endless searching.
Persona Development
Ryan, The Social Movie Streamer
Persona
After the kickoff presentation, we were ready to get started. To help us have a consistent idea for who we are designing this landing page for, we decided to create a user persona based on the information we were given about their users in the presentation, as well as information we gathered from discussing with the founders of Siftr.
Ryan, a young professional in Atlanta, is a movie buff who enjoys watching with friends. He craves efficient ways to discover top-quality content across platforms, avoiding wasted time and ensuring he stays up-to-date with trending titles to discuss with friends.
Primary Persona
Design
From Challenge to Design
Style Guide
Now that we had a good idea of what the founders of Siftr wanted out of this landing page and who we were designing the landing page for, it was time to head home and jump into Figma to start designing.
This first thing we did was take the style information and assets they gave us in the kickoff meeting and turned it into a small style guide to help us stay consistent and within the brands style.
Siftr Style Guide (Figma)
Inspiration
We then searched the internet for landing pages with a similar purpose of getting people to download an app for inspiration. We then compiled ones that we felt suited this project into an inspiration board for us to refer back to.
Inspiration Board (Figma)
Designing
Now that we had a style guide and inspiration board created, we were ready to hit the ground running designing screens in Figma. The image below shows the evolution (top left to bottom right) of what the first designs looked like and how they changed to become closer to our final design.
Inspiration Board (Figma)