DESIGNTUTORIALSPACE

Case Study:


Project Overview


The Problem

There are various platforms that offer design tutorials like Youtube, Dribble, Adobe Videos, Coursera, Udemy…etc. But no platform has made it accessible enough to offer everything on the same website.

The Goal

Design a responsive website for finding and viewing design tutorials.

The Product

DESIGNTUTORIALSPACE is a responsive website for finding and viewing design tutorials. This platform will help users with the design tutorials being more accessible to them.

Responsibilities

Conducting Interviews, Paper and digital wireframing, Low and high-fidelity prototypes, Conducting usability studies, Accounting for accessibility, Iterating on designs.

My Role

UX designer designing a responsive website for finding and viewing from Research to delivery.

Project Duration

May 2022- June 2022

Understanding the User

I conducted user interviews, which I then turned into empathy maps to better understand the target user and their needs. I discovered that a lot of users were struggling to find the same kind of videos across platforms as it took more time and energy and no platform yet has made it accessible enough to offer everything on the same website.

User Pain Points

  1. Platform

Looking for same types of videos and hours spending on different types of platforms to find a compelling design tutorial

2. Experience

Many of the design tutorial websites didn’t have the favorite button to save their most liked video

Persona & Problem Statement

Abby is a busy college student who needs a single platform to save her design videos because she wants her videos to stay organized.

Starting the design

Sitemap

The struggle to keep the videos organized in one single platform was the primary problem so I used that knowledge to create the Sitemap.

My goal here was to make strategic information architecture decisions that would improve overall website navigation. The structure I chose was designed to make things simple and easy.

Paper Wireframes

Next, I sketched out paper wireframes for each screen in my app, keeping the user pain points about Platforms and Experience.

The home screen paper wireframe variations to the right focus on optimizing the the browsing experience for users.

Initial Wireframes

Refined Paper Wireframes

Digital Wireframes

Moving from paper to digital wireframes made it easy to understand how the redesign could help address user pain points and improve the user experience.

Prioritizing useful button locations and visual element placements on the homepage was a key part of my strategy.

Usability Study Findings

Some of the main points that uncovered during the usability study.

Favorites

Users wanted a favorites section where they could save their most liked video and make it organized.

Videos

Users wanted videos linked in a single platform

Refining the Design

Mockups: Original Screen Size

High Fidelity Prototype

The final high-fidelity prototype presented cleanser user flows for smoother payment process and checkout.

View the prototype here


Going Forward

Takeaways

  • Impact

The app makes sure the that it is accessible enough to access the links for students and users making the use of the design tutorials.

  • What I learned:

While designing the app, I realized how important the app being accessible was. The usability studies helped a lot to finalize the iterations and designs.

Next Steps

Conduct some more interviews and usability studies to see for any other considerations for features.