Tord-Tape-Tools: A Transcribers’ Workspace
User Interface Design, Usability, Web Development (Nov 2017)
Overview
Tord-Tape-Tools is a simple web-based workspace for manual audio transcribing. This project provides simple but useful tools for transcribers such as various audio playback control options and keyboard shortcuts.The project gained popularity in the publishing field in Thailand and was featured on thematter.co, a popular online magazine in Thailand, and on Rainmaker, a popular news feed for content creators.
Note: tord-tape is a Thai word which means to transcribe.
The Problem
Manual transcription — the act of listening to an audio file and type the words it into text — is a tedious task for content creators, researchers, students, and many other group of people. The task not only takes a lot of time but it also is particularly frustrating with the workflow of having to switch back and forth every few seconds between a word processing software and the media player software. Having heard these complaints from people who transcribe, I was inspired to build this mini-tool to make their transcribing experience a bit more pleasant.
Introducing Tord-Tape-Tools
Tord-Tape-Tools is a web-based workspace for manual audio transcribing. It is designed to be a one-stop application for manual transcribing. The goal of this application is to make a streamlined workflow for transcribers. This can be done by minimizing the time wasted in and the confusion arising from switching back and forth between applications.
Put simply, Tord-Tape-Tools, is a combination of a basic word processing software and a media player. It provides these functionalities:
- A notepad-like transcription area
- Audio playback tools with multiple seeking and playback speed options (e.g. play/pause, seek back for 5 seconds, make audio slower, etc.)
- Most Important: Keyboard shortcuts for audio playback so that the user does not have to lift their hand from the keyboard. Because every second matters!
- And a few other transcribing-specific shortcuts e.g. timestamps and speaker identification (adding “Speaker 1: ” to the text with just one shortcut)
Therefore, the workflow of a transcriber in this application will go as follows:
- Open an audio file.
- If needed, set up speaker names for the shortcut
- Play the audio file and start transcribing.
- Hit keyboard shortcuts to control audio playback while typing without having to switch apps
The Design
Apart from the functionalities, this application is also designed with the goal of making it simple to use.
Visually, the interface is designed to be clean with an eye-catching red instruction tooltip guiding what to do first when opening the application. After opening an audio file, the user then play it and types the transcription on the left panel saying “Type your transcription here”. The right panel explicitly shows shortcut keys listing all of the functions they can perform in this tool.
Moreover, because transcription usually takes a long time to complete, save/load functionalities is provided in this app. For the same reason, users will also likely experience eye strain from such tasks. To mitigate that, dark theme and serif font option are also available under the Preferences menu.
Selecting the Shortcut Keys
There are constraints for which shortcut keys can be used for the controls. Firstly, because users will be typing their transcriptions and, at the same time, controlling the audio, we cannot use just one key such as spacebar and arrow keys to control audio, though this will be familiar to the user. Therefore, a key combination is needed.
Second, this is a web-based application, there are constraints on which shortcut keys can be used. Some shortcut keys are reserved for browser use and should not be overridden, esp. those with Ctrl or Cmd. So we used Alt instead (for windows). Unfortunately, Alt+space is also Window’s reserved shortcut keys so it cannot be used for play/pause.
As a result, natural mapping was utilized as a mean to ease the learning process. The left-most Alt+z is for play/pause, the next two (Alt+x and Alt+c) for seeking, and the next three (Alt+v, b, and n) are for playback rate — all ordered from backwards/slower to forward/faster.
Known Issues
Though this online tool seems to have gain many positive reviews from users, there are some known issues, both design and technical, left to be solved and to be improved in future versions.
- Design Improvements Shortcut key guides on the right panel could be move closer to the seek/playback rate buttons on the bottom of the page to make it visually easier to associate a shortcut with an action.
- Technical Issues There is still a bug that causes the audio file to rewind back to the start of the recording when the user seeks to audio file too far away. This occurs with large audio files.
