To explain to transport networks the benefits and concepts of Metronet, I wanted to create a launch/brand video.
I started by drafting the points I wanted to make in relation to the purpose of the video.
<aside>
Highlight the purpose and key features of Metronet to potential joining networks.
</aside>
<aside>
Of the 76 cities in the UK, only 5 have “good” apps for their public transport networks according to users.
Apps are complex and difficult to develop and manage with small teams and tight budgets.
The majority of these apps all share the same issues with their user experiences.
So why not just make 1?
Metronet is a single, centralised app for public transport networks to provide their digital services through.
Metronet has been created with best practice design patterns to ensure a simple, intuitive, and comprehensive user experience.
Users access transport networks through a single Metronet app, allowing for seamless transistions between cities without having to download network specific apps.
Network identity is still visible within the app. Network brands are not hidden and actively inform the user interface.
Users can plan routes, pay for tickets, and navigate journeys all to the specific networks needs and requirements.
Networks can manage their services, brand, and data through Metronet Conductor.
The Plan module allows networks to control and manage services, routes, and timetables.
The Promote module allows networks to document and develop their brand and visual design.
The Improve module allows networks to access all their operational data, as well as share learnings between other networks.
</aside>
Next, I needed to choose what to create the video in. I had used AfterEffects before, but find it very complex for simple tasks. Instead, I chose to use Jitter, an browser based light version of AE with templates and shortcuts that will make animating faster and smoother.
Another reason for choosing Jitter was the workflow I could use with it. There’s an official Figma plugin that lets me copy Figma frames directly into Jitter, so I could layout each scene in Figma then copy them across. This made the set up really easy.
I then worked through animated the layers in Jitter, making sure to keep things organised by scenes and types to ensure a smooth process.
After a first draft I got some feedback. While the video was really good, it was too fast and was hard to read some of the information.
I went back and extended the whole animation to allow users more time to read.