Introduction
Context
Discovery
What to solve
Design research
Highfidelity
Conclusion

Freelance Product Design — Subtitle and Transcription Generator
Xerpihan is a SaaS and EdTech language startup with a mission to break the English-Indonesian language barrier. Our key services is transcription, which converts voice or recordings into clear, easy-to-read text

Our goal is to design a user-friendly platform that allows users to easily turn their media into transcripts. These transcripts can be accessed anytime through a mobile-friendly web interface

My Job
Defining and designing human interactions to make it easier for users to use the transcript feature — easily and quickly

Timeline
1 Weeks (Q1 2023)


Context
Xerpihan is a language service in Indonesia that sees big potential in using technology to improve its services. The main challenge is too much on manual work, which takes time and limits growth

With new advancements in AI, Xerpihan has a great chance to grow. By using more automated tools, it can serve more customers, work faster, and automated-based services


Discovery
OpenAI is the main technology we use to provide transcription services. Our transcription includes both text and time-stamped formats, making it easy to follow along. This allows customers to use the transcription service on their own, anytime they need it


What to solve
How might we make transcription services easier to use on mobile browsers, so customers like media, press, and field reporters can quickly convert recordings into transcription?

Our challenge was to create a mobile-friendly platform that would make it easy for them to get the job done using only their mobile devices


Design research
After gathering information, needs, and requirements; I start the design process to identify how the user will interact with the service and what information they need to help them achieve the goals

The goal was to help the user use services that are more accessible and user-friendly to get their transcription

After getting the big picture of the service, I started wireframing that can clarify features, navigation/flow, and ideation placement of the information


Highfidelity
The dashboard helps users stay updated on the progress of their media transcription. It shows the current status and the time when the transcription will be ready. This makes it easy for users to track and understand their transcription progress

To guide user the process using stepper component, so users know exactly what to do at every stage. This step-by-step approach makes the process easy to understand and follow

Organizes subtitles into segments with timestamps, making it easy for users to edit and manage their transcriptions. By grouping text by time, users can quickly find, update, or modify specific parts of the transcription without confusion

Giving users control by offering multiple export options. Allowing them to choose their preferred formats based on their needs

To enhance user convenience, the design allows users to leave the page while the transcription is in progress. Once the process is complete, the system automatically notifies the user via email, ensuring they can seamlessly continue their activities without needing to wait on the platform.


Conclusion
Before starting the design process, I begin with thorough research to fully understand the project scope. This includes analyzing the brief, understanding the client’s goals, identifying user personas, exploring the technology and services involved, and studying transcription workflows and patterns.

This foundational research ensures the design aligns with user needs, business objectives, and technical feasibility. Make sure everything is possible to slicing into the code

macintosh Crafted with pure html, js, scss from scratch like psychopath