Translating Taiwan
A UX approach to the website design
Project participant recruitment website
Desktop website prototype in Adobe XD
Desktop website prototype in Figma
About the project
Translating Taiwan is a research project, funded by Heriot-Watt University, for the public and translation scholars to better understand the linguistic history of polyglot sites in Taiwan. As a research associate, I am responsible for the project website design and development. The design process takes a user-centred approach to planning and designing the web experience.
The project currently is working on data collection for the web publication and is expected to be completed in November 2022. This page only reports some work in progress, with a focus on UX study methods and design strategies on accessibility.
Design process
Putting personas to work in web content design
Based on the initial research on the target users, I created the user profiles and then defined what content they would require for them.
A member of the public with an interested in translation studies
James
Age: 20
Language(s): English (native); Mandarin
Job: full-time undergraduate student
Location: the UK
James is a university student studying in the school of Literatures, Languages, and Cultures in the UK. He enjoys learning about Chinese cultures and languages and hopes to become a professional interpreter in English Chinese translator in the future. James is very comfortable with technology and enjoys using it to discover more about the language and history.
A scholar in Asian cultural studies
Anna
Age: 36
Language(s): English
Job: University lecturer
Location: the UK
Anna is a senior university lecturer in Asian cultural studies, where she teaches a variety of courses and manages research projects. Her research focuses on the analysis of Chinese literary translation and comparative linguistics. She wishes to advance research in this area and form new global collaborations. She frequently uses the Internet to find journal articles and learn more about relevant research projects.
A research funder
Chia Hsin
Age: 40
Language(s): Mandarin (native), English
Job: Research funder
Location: Taiwan
Jane works for Taiwan’s research funding agency as a researcher funder. Her job is to distribute a large funding budget to a diverse set of projects across the country. She must learn about and report on the outcomes of research projects funded by her organisation.
A stakeholder in managing multiple voices in public spaces
Ming Wen
Age: 50
Language(s): Mandarin (native), English
Job: Museum manager
Location: Taiwan
Charlie is a museum manager in charge of managing the museum’s exhibiting spaces. His goal is to create an inclusive environment in which different language users feel respected and can learn more about the history of the objects on display.
Wireframing
After defining the key features and the essential content of the website, I created the first set of wireframes in Miro to communicate the arrangement of the UI elements on the page. As the research project progressed, I continued to create wireframes to explore new designs.
User study
I applied several research methods to collect user feedback on design at different stages of the design process. Based on the insight from user studies, I refined the UI design.
Design preference test
To define the look and feel of the website, I created 3 sets of high-fidelity mock-ups for the test participants to choose their preferred visual design for this research topic.
The test was conducted via Usability Hub.
Creating interactive prototypes for usability testing
There are several interactive prototypes created for the screen flow demonstration and website usability testing.
Tree testing
I did a tree testing to evaluate the website menu. The results improve our understanding of which label is not easy to understand for the target user group.
The test was conducted via Optimal Workshop.
Designing for accessibility
To make this project website accessible for as many people as possible, I took several approaches to improve the accessibility of the website.
- Followed the government’s guidance on the web accessibility requirements for public sector bodies
- Added Alt text to the non-deco images in HTML
- Enhanced the visual presentation of text to have a contrast ratio of at least 4.5:1
- Improved the writing to make each heading identify its section of the content
- Made the textual content to be resized without loss of content or functionality, and without requiring scrolling in two dimensions
- Added the accessibility tool (UserWay) for users to change the presentation of the web content to suit their accessibility needs
- Used the web accessibility evaluation tool (WAVE) to ensure content compliance with accessibility standard WCAG
- Developed two languages – English and Mandarin – to increase the audience reach
- Established research data method to include Alt text to images and transcripts to videos and audio files for web publishing
- Wrote up the Accessibility Statement and linked to each page footer to provide accessibility support and demonstrate commitment to accessibility and social responsibility
