Home

UX Design

Twitter

Twitter

Twitter

The case study about Twitter Blue highlights my job as a UX/UI designer who made the subscription service better for users. It shows how I did research, made easy-to-use designs, and gave them something valuable.

The Twitter Blue case study shows how I made the subscription service better as a UX/UI designer. I researched, designed user-friendly interfaces, and delivered something valuable.

2020 - 2023

Figma

Adobe Suite

Teams

Jira

Project overview

My main job in the UX/UI design project for Twitter Blue Subscription was to make using Twitter's premium service smooth and exciting. The aim was to make users happy, get more subscriptions, and offer special stuff to subscribers.

For the Twitter Blue Subscription UX/UI design project, my main job was to make sure using Twitter's premium service felt smooth and exciting. The aim was to make users happy, get more subscriptions, and offer special stuff to subscribers.

Design Challenge

The challenge is to design a welcome process that shows users why Twitter Blue is great and helps them sign up easily. The onboarding should achieve these goals:

The challenge is to design a welcoming process that shows users the perks of Twitter Blue and helps them sign up easily. The onboarding experience should achieve these goals:

User Persona

Through researching users, finding problems, and looking at feedback, competitor info, and industry trends, learn about what users want, what's not working, and where Twitter's subscription model can get better.

User Flow

After making the flowchart, I used pen and paper to draw simple wireframes for the main user steps. Because of limited space, I only displayed a couple of digital rough wireframes. These early designs were created to match Android users' needs, following Material Design guidelines.

After setting up the flow diagram, I began drawing rough sketches on paper for the main user journey. I could only show a couple of the digital low-fidelity wireframes due to limited space. These initial wireframes were tailored for Android users, aligning with Material Design guidelines.

Design System

I set up a complete design system at Twitter, creating clear rules and reusable design elements. This made the design process smoother, keeping things consistent and improving how users feel.

I worked with different teams and made detailed guides for easy use. This made things work better and look more unified.

Wireframes

Took the initiative to lead wireframe development for key projects at Twitter. Utilized user-centered design principles to create intuitive and effective layouts. Collaborated closely with stakeholders to understand requirements and incorporate feedback. Produced high-fidelity wireframes that served as a foundation for successful design implementations.

Hi-Fidelity Wireframes

I took charge of creating wireframes for important projects at Twitter. I used user-focused design ideas to make easy and useful layouts. I worked closely with relevant people to get what was needed and to adjust based on their input. I made detailed wireframes that became the basis for successful designs.

Mockups

For this case study, I have created a mockup that showcases the design concepts and user interface elements implemented in the Twitter Blue subscription service. The mockup provides a visual representation of how the subscription features seamlessly integrate into the existing Twitter platform

User Testing

Before testing with users, I made a mockup that acts like a prototype for the Twitter Blue subscription service. This helps gather user feedback. The mockup lets people try out the main features and see how the design works in practice.

After testing, we chose to put the payment buttons in the blue notification intro. This way, customers have two options to pay, making it easier for them to complete the payment and get Twitter Blue.

Prototype

In the prototypes part of the case study, I'll show how I can make interactive prototypes. I'll use an example from another project since I can't use screens from the specific Figma project.
This will show how I can turn still designs into exciting user experiences.

Result

  • Developed a new user interface for the Twitter Blue Subscription that increased conversion from non-subscribers to subscribers by 60%.

  • Optimized design system for mobile design that increases user engagement by 20%.

  • Conducted user research and usability testing to identify and resolve usability issues, resulting in a 50% reduction in customer frustration.

  • Icon tributed fresh value to the team , provided support to the entire group, and played a role in enhancing the team's speed by 25%.

Followers

Gained a lot more followers using
smart strategies and data-driven
insights in the Twitter Blue case study.

Organized

Got more followers using smart

strategies and data in the Twitter Blue case study.

Design

We collaborated creatively to create eye-catching designs that stay with users.

Next project