top of page

UX CASE STUDY (ONGOING)

MARK & SNIP

A Video Editing Platform that Revolutionizing Employee Training Through Social Media-Inspired Content Management

MY ROLES

  • Sprint Leader

  • UIUX Designer

  • UX Researcher

  • Project Manager

TOOLS

  • Figma

  • User Research

  • Competitor Analysis

  • Wireframe / Prototype

  • User Testing

TEAM MEMBERS

  • Saie Wable

  • Dimple Chandnani

  • Shruti Muralidas

  • Shihao Lan

  • Yu-Chi Mei

DURATION

Aug. 2024-May 2025 (10 months)

THE PROBLEM AREA

Guide is a learning management system that streamlines employee training and onboarding experience.

Currently, to corporate training materials are lengthy and unengaging, making employee onboarding and continuous learning inefficient.

THE CHALLENGE

To simplify the process of extracting and condensing information into manageable snippets.

DESIGN PROCESS

We used Google Ventures Design Sprint Methodology to help us rapidly generate and test solutions within our timeline.

Screenshot 2025-01-19 at 7.41.12 PM 1.png

TO DESIGN VIDEO EDITING FEATURES OF A LMS, WE GATHER INSIGHTS FROM THESE SOURCES:

CONTENT CREATORS

Transform complex materials into engaging video content

EMPLOYERS

Create onboarding materials that align with organizational goals and reduce training time

EMPLOYEES

Discover how onboarding videos improve engagement over traditional methods

USER RESEACH

The four key questions before our design sprints:

  1. How can we optimize file upload processes and potential automation opportunities?

  2. What is the optimal placement and integration of the “Mark & Snip” feature based on user behavior?

  3. What are the critical pain points users face when using the Guide app?

  4. How can we enhance the video editing experience and address any performance issues?

SEMI-STRUCTURED INTERVIEW

Through informal conversations with video creators, HR personnels, and employees, we gained deeper insights into our participants’ experiences.

Monitor.png
Eye.png

COMPETITIVE ANALYSIS

We identified current trends and video editing functionalities in the market, reviewed existing platforms, analyzed features, watched product demos, and analyzed tools for inspiration.

PAIN POINTS &
KEY FINDINGS FROM USER INTERVIEW

TIME-CONSUMING EDITING TASKS

It is time consuming to plan workflow, select videos, and apply customization in editing tools

MOBILE EDITING APPS LIMITATIONS

Phone apps frequently fall short in customization, resulting in limited workflow flexibility.

BUILT-IN TOOLS & AI LIMITATIONS

Complex editing decisions and accurate captioning remain challenging for AI.

COMPETITIVE ANALYSIS

We analysed Video Editing & Uploading Software to collect value propositions, potential features, and prepare for design wireframes.

MAPPING

“ How might we enable the user to upload and manage multiple videos? ”

With the HMW question, we developed 2 personas and an ideal journey with major steps to access the guide app, upload and edit videos and track performance

User Journey Map 1.png
User Persona - Trainer.png
User Persona - Trainee_edited.png

SKETCHING IDEAS

Followed the Mapping stage, we first doodled out hot ideas, and followed with crazy 8s to brainstorm and generate variety of ideas.

Screenshot 2025-01-25 at 11.39.11 PM 1.png

DECIDE STAGE

During the Decide stage, we rapidly evaluated and voted on each team members’ sketches to identify preferred features, with the client's “supervote” to determine the direction to pursue for prototyping.

CHANGE OF DIRECTION

At the end of Sprint 2, the Guide app changed their business proposition from a learning management system to a post therapy mental healthcare app

CHALLENGES

Research Misalignment:
We need further research to understand the new target audience and ensure our work aligns with their needs

SOLUTION

We conducted Thematic Analysis, Secondary Research, and Competitive Analysis of different apps and websites in the market with the similar purpose

RESEARCHES ON MENTAL HEALTH APP

THEMATIC ANALYSIS

We conducted a thematic analysis of forum discussions to identify the patterns in therapists’ experiences on Post Session

SECONDARY RESEARCH

We conducted secondary research on video based social media

KEY FINDINGS FROM RESEARCHES

POST-SESSION ENHANCES PROGRESS, BUT FLEXIBILITY IS THE KEY

Some therapists use structured platforms like Blueprint for progress tracking, while others focus on collaborative problem-solving and adapting to the client’s pace

VISUAL PROGRESS TRACKING AND PRACTICAL TOOLS INCREASE MOTIVATION

Platforms should incorporate features that enable visual progress tracking and provide access to easily accessible tools and resources

COMPETITIVE ANALYSIS

We conducted competitive analysis on therapist applications, identifying key features related to the Guide App.

We also conducted competitive analysis on patient applications and identified TeenTalk as a close competitor. In addition, we analyzed social media video editing tools like Reels and TikTok to streamline our feature set, focusing on core video editing functionalities.

INFORMATION ARCHITECTURE

We created the information architecture for both desktop and mobile version to produce user flows and main functionalities

WIREFRAME LOW FIDELITY

We translated our top-voted design ideas from sketches into mid-fidelity wireframes.

CREATE A NEW COURSE

  • Users could start creating a new course by choosing either upload new content or choosing from existing templates/ libraries

EDITING THE COURSE VIDEO

  • Users could edit the course video from adding media, chapters, captions, effects, to trimming, cropping, or deleting videos

PUBLISH THE COURSE VIDEO

  • Users could publish the course video with details such as title, description, tags, and add to series.

USABILITY TESTING

We conducted usability test using the Useberry Software. We designed 6 scenarios to gather users insights before proceeding, and based on the test results, we gained feedbacks and iterated designs accordingly.

ITERATIONS

SIDE MENU REORDER

Users expect the editing features to be placed at the top of the side menu and the settings features at the bottom, as editing is used more frequently.

TERMINOLOGY CLARIFICATION

Users found “Mark” difficult to understand what is this feature and how it works

CARD SORTING

  • We conducted card sorting to explore users’ expectation in terminologies and the order of navigation menu

  • With improvements, time was significantly reduced by 20%

THE DESIGN SOLUTION

You can see, inspect, and download the entire project on website and mobile version in Figma

  • 電報
  • Dribbble
  • GitHub
  • LinkedIn

© 2024 by Chien-Chi Liu 

bottom of page