Future Transports

Overview

I created a responsive microsite that showcased various topics and stories in an interactive and captivating manner. The microsite was designed to allow users to explore the information either through a linear narrative or by freely navigating the site.

My roles

User experience designer
User interface designer

Project type

UX/UI Design

Year

2022

Process

Throughout eight weeks, my focus was on researching multiple public transport initiatives, with a particular emphasis on trains, which remain the only mode of public transport that doesn't contribute to environmental pollution.

Rail transport is a sustainable alternative to personal vehicles like cars and motorcycles, but it can have drawbacks. While it's eco-friendly, it often requires significant government investment, which can be a concern for taxpayers. Furthermore, rail development can harm natural habitats and ecosystems. It's important to consider both the benefits and drawbacks of rail transport before deciding to use it.

The solution was to design a website that emphasizes infographics that showcase statistics on public transport and sustainability, but it's important to recognize the drawbacks of these initiatives. Political interests may negatively impact the environment, and the high costs associated with these projects can create economic disparities between regions. Additionally, there may be health concerns, such as the spread of communicable diseases. By weighing the pros and cons, we can create a more sustainable and fair transportation system for all.

Research

I did visual research on stories like the HS2 project. I made a mood board to help me create content about it. At first, I only wanted to talk about HS2's problems, but I added positive things from other global projects to balance it out and expand the discussion.

User Flows

To start the process, I created user flows to simplify the microsite's navigation, beginning with an introductory video and then with a timeline-style scrolling so that the user can see the opening years of each transport project.

Low fidelity prototypes

High fidelity prototypes

Typography & Colour

I designed the microsite with inspiration from websites featuring animated transitions and infographics. The user interface is minimalist and clean, making it user-friendly. Future Transports showcases railway projects in a playful and animated way, catering to train enthusiasts.

Each project has a timeline with its inauguration year. We included infographics with credible sources to back up the information. The site is responsive and works on all screen sizes, including mobile devices and tablets.

Usability Tests

Four students from Norwich University of the Arts, each from a different Graphics course, participated in usability tests to assess the microsite's accessibility and visual errors.

Web Coding and Animations

To enhance my software skills, I utilized Webflow, a website-building and hosting software service with an intuitive visual editor platform that enabled me to create, design, and launch the website.
Webflow screenshot
Webflow
Microsoft Visual Studio Code screenshot
Microsoft Visual Studio Code

Evaluation

To enhance the user experience of the microsite, I envisioned incorporating animated infographics to provide a unique and engaging visual experience.

Additionally, I recognized the need to reduce the text size in some areas to draw more attention to the infographics, which are the primary focus of the website. Creating a responsive website was a challenging experience, but it provided me with invaluable knowledge and skills in web design.

This experience sparked my interest in pursuing a career in web design, as I found it to be an area in which I feel particularly comfortable and competent.