Train Station Navigation App: UI Design Process (2024)

During my Strategic Design for Business class (GDES 208) at BCIT, certain User Interface (UI) and User Experience (UX) principles, concepts, and techniques were taught and applied to create a comprehensive campaign project for a digital application or website of our own choosing. I came up with an idea of developing a train station navigation app for major cities and locations in Southwestern Europe, where most travelers and tourists go to, in order to facilitate ease, convenience and peace of mind while traveling, as well as eliminating language barriers especially for foreign travelers.

This particular artifact page focuses on the UI design portion of the app development whereas a separate page is dedicated for the UX portion here.

Project role:

UI/UX Designer (Individual class project)

  • Created all project deliverables: designed the layout; created vector graphics; sourced and applied typefaces/fonts and colour schemes

Program used:

Figma

Key skills demonstrated:

UI/UX design  |  Strategic Design for Business |  Research and Analytical thinking  |  Usability Testing  |  Prototyping

UI Components for Content Objects

 

 

Prototype

 

Figma Link for Design & Prototype

 

Link

Lean Canvas

Reflection

 

This part of the project was definitely what I enjoyed the most as it involved visual designing. While it was not my very first time using Figma for prototyping, designing specifically a mobile app for navigation certainly was and I had been really looking forward to getting to this stage.

I had the Google Maps mobile app layout as the primary inspiration in mind for its fool-proof design when it comes to navigating places, of which most other navigation apps also patterned their designs from so I thought it would be a good decision to do the same. I also thought that the users' familiarity with it would be a crucial factor in attracting and keeping consumers for this new navigation mobile app.

Comments are closed.