07 User Experience Design: Link
Brief Summary
This project required the expansion of our brand and visual identity created on the Center for Language Learning, into a UX/UI digital platform. The project could either be a self-initiated, language-related app/website or an app/website focused specifically on the Centre for Language Learning. The project could differ from, but had to complement the previously developed brand. The project scope required the core function of the platform to be shown in a single-user journey. An emphasis was placed on the overall design process of user testing, journey mapping, design systems, wireframing and prototyping.
Deliverables
1. User-flow journey
2. UI style guide
- Base guidelines: (typography, colours, grid system, padding & spacing rules, iconography)
-Interactive components: (buttons, menus, modals, card designs, switches/ toggles, text inputs, radio buttons etc)
3. Wireframes
4. Vertical narrative
5. Process work
Design Strategy
I chose the option of creating a self-initiated, language-related app. The rise in expat living and travel for work or leisure brings difficulties in adapting to new areas where you are not familiar with the native language. This resulted in the creation of an “on-the-go” translation app which can be used on mobile or smartwatch platforms.
The upbeat, friendly visual language was re-crafted to include characters and customised icons created from language and learning symbols; crafted to make Link feel like your fellow friend in a foreign environment. This visual language was paired with the streamlined design and flow of the screens to achieve the app's aims of easy and effective use.
Crafting communications
A look into the process
The app's overarching language-based theme and visual style were derived from the previously created corporate identity of the Center for Language Learning. An iterative exploration of purpose-led ideas was explored to create an app concept with the aim of connecting people to each other.
A fresh translation
Link app update and improvement
Fellow friends
User personas
Learning the lingo
Style guide breakdown
The app's user interface design choices stemmed from extensive research (view here) on existing design systems that work well and the best practices they use.
Flowing through the foreign
The final user journey involves the process of signing up to a new account which includes text field error states and password requirements. Thereafter the user has the opportunity to customise their app experience by selecting which app features are most applicable to them. This specific journey allows for the user to conduct a voice recording translation session and then save it to their library for future reference. The voice recording feature translates into an interactive apple watch interface as well.
Fellow friend feedback
User testing insights
Through a series of iterative tests on a range of different users I recorded feedback and improvements to the app at each stage of development. The full process can be (viewed here) in the organisational format of affinity maps.
Zero to Hero
Phone screen prototype
Swift, smooth translations
Apple watch prototype