FedEx

PROJECT 1 – The FedEx app

The FedEx mobile app allows users to create domestic and international shipments, get rates, find drop-off locations, get real-time alerts on shipping and deliveries, and more. All from your phone. The app is available for iOS and Android, for phones, tablets and wearables. In June 2020, there were 2,2 million engaged users in total.

Overview

The mobile team located in Amsterdam (actually, Hoofddorp) consisted of a Product Owner, UX/UI designer (me!), iOS and Android developers and a tester. Our team followed an Agile development approach and collaborated with teams located in Memphis and Dallas on new feature development and overall improvements for the app.

My role

I was responsible for the user experience and interface design of the iOS and Android apps, mostly focusing on the Track&Trace and FedEx Delivery Manager for the US and for the international version (covering 41 countries including Europe). My work mainly consisted of new feature development for and overall improvements of the recipient experience.

I also worked together with the marketing team to update the FedEx brand identity on the mobile interface design. This included creating a style guide, in collaboration with developers to outline specs and deliverables, and with the content team to establish short and relevant copy guidelines for small screens.

Duration

This project took place between September 2018 and August 2020.

Design concept

The screens below show a concept flow for the recipient experience. Based on the existing functionalities, these designs show how the app would look like after applying the recent brand guidelines and improving the main navigation by using a tabbar (iOS) and side navigation (Android).

The Tracking Summary Screen

The Tracking Summary Screen is one of the most used areas of the app. The screens below show different iterations and options created with input from a varied set of stakeholders, brand guidelines and a complex set of business rules. These designs were validated in several usability tests and adjusted based on user feedback, resulting in a final design that ensures an optimal user experience while, at the same time, covering all business requirements and backend limitations.

FedEx Delivery Manager®

The FedEx Delivery Manager® is a functionality on the Tracking Summary Screen with which users can manage their delivery. For example, users can choose another day or location to get their shipments delivered should they not be at home at the scheduled day and time.

This functionality was quite complex given differences in logistics processes in the US and across the world, as well as many backend and legacy system limitations.

In the US, users can configure delivery options independently from each other. For example, a user can simultaneously request a vacation hold and add a delivery instruction. For this reason, the interaction design allows all options to be visible at the tracking summary screen at the same time.

For international markets, users can only choose one delivery option at time. To avoid options disappearing from the action list, the options are placed in a modal that overlays the tracking summary screen.

In this way, the interaction design is created for each specific market, ensuring the best contextual user experience, while still keeping the same FedEx look and feel and brand guidelines throughout the app.

Project 2 – City Logistics

Overview

This project was a proof of concept for a bike courier application aiming to explore the opportunities and capabilities of having such an application being used by FedEx bike couriers in the main European capitals. This proof of concept was designed for Amsterdam, but was intended to be expanded to Berlin and other capitals in Europe.

At the beginning of the day, the courier would scan the packages in the depo, which would generate an optimal route. The courier has the option to edit the order, and by confirming it, the app would display an estimated time of delivery for each address. Clients would be notified about these times, and any changes that would happen along the way, reducing the time window they would have to be home waiting for the courier.

My Role

I was responsible for the user experience and interface design of the Android app. Together with the team in Amsterdam, we had to understand the whole logistics related to package delivery in big capitals, and think of a way of making it possible to do it in a small vehicle such as a bike.

Duration

This project took place between August and October 2019.

Project 3 – File a Claim

Overview

The goal of this proof of concept was to get the teams in Amsterdam and Dallas to get to know each other better and collaborate on a project for the first time, getting familiar with coding, designing and worming in a team from different sides of the world.

The result was a connected experience for filling in the File a Claim form on FedEx.com easily by using the mobile phone as a second screen.

My Role

Together with the developers, we created the concept for the project. I was responsible for the user experience and interface design of the mobile app and the mockups for the web pages.

Duration

From concept creation to final development and demo to stakeholders, this whole project was done in only one week, in September 2018.

STEP 1

The user opens the File a Claim form on the web, which has 3 steps – Shipment information, Claim details and Your information.

STEP 2

In the Shipment information section, the user has to enter the Tracking number to get started, which can be done manually, or by scanning the QR code with the mobile app. Scanning the QR code will connect the app with the website.

STEP 3
Now the app is connected, the user is asked to scan the package label on the damaged package, which will automatically fill in all shipment information on the website.

STEP 4

On the Claim details section, the user can upload photos of the damaged package. Since the app is connected to the website, the user can take photos with the phone, and they will be uploaded to the website in real time.

STEP 5

The last section containing personal information will be automatically filled in with the information used when the label was created, and doesn’t take any further action from the user. With only one click, the user can submit the claim with no effort.

TNT Design System

Overview

In only two years, the TNT digital products – dotCOM, myTNT, Track&Trace and mobile apps – grew apart from each other in terms of interaction and visual design, resulting in an inconsistent and fragmented user experience across the different TNT touchpoints. There was no central place for designers to understand how they should create new components and apply consistently the TNT brand and existing interaction patterns. The developers also had to create their own style guide and component library. That created inefficiencies and led to increasing fragmentation and inconsistency. To address these gaps, we built a team responsible for the TNT Unified Guidelines – an online platform with visual guidelines, style principles, components and interaction patterns to be used by all designers and (frontend) developers in the company.

My role

I was the Design Lead for the TNT Design System, responsible for assessing, defining and scaling the TNT design language and creating a consistent and unified user experience across all TNT products. I also delivered and maintained a Design Library (Sketch UI Kit) as an easily accessible and convenient way for designers across the company to implement the guidelines in their designs.

Duration

This project took place between February 2017 and September 2018.

Mapping the fragmentation and downscaling

The first step was create an inventory of the differences across the TNT digital touchpoints (dotCOM, myTNT, Track&Trace, mobile), and assess channel-specific situations and needs. This inventory helped define situations in which the differences among touchpoints should be kept, as well as determine instances that had to be aligned in a way to remove unnecessary differences.

tnt_design_system

In terms of visual design, there were 85 different colors being used. Even the application of the main brand color was often slightly different than the one defined in the brand guidelines. There were 62 different font sizes, and 41 different button styles. By capturing design and interaction patterns, we could downscale these elements to a color palette of 17 colors and a selection of nine font sizes to create intentional flows, user focus and progressive emphasis. We also could narrow down the 41 different button styles to six, thus simplifying and standardizing the user experience.

Creating an unified TNT Design System

In order to break down the brand guidelines into its basic components and work up towards a unified language, we relied on the Atomic Design Methodology (by Brad Frost). This methodology helped us compare and simplify design elements and bring back consistency.

After redefining the brand values and visual components, I create a Solid UI kit (Sketch file) with building blocks. This kit could be used as a Sketch Library, from which designers could select symbols and create new designs using the same components and interaction patterns, resulting in a unified and easily accessible language.

In collaboration with a frontend developer, we created an online platform for designers and developers, documenting these components and interaction patterns, and providing developers with code snippets in order to bring more efficiency in their workflow, and guarantee consistency.

ATOMS

MOLECULES

ORGANISMS

TEMPLATES AND PAGES

Design Library – Sketch toolkit

UPC app

Overview

The UPC app was designed to allow UPC users to manage their subscriptions, keep track of their data usage and add extra bundles, download and pay bills, and manage notifications.

My role

I was responsible for the UX/UI design for the Pan European app, helping the stakeholders to translate their requirements into user needs and features, and aligning the visual and interaction design with the apps used in other regions.

Duration

This project took place between May and July 2016.

Navigation

We created and tested two different options for navigation – one using a native tabbar component, and the second using an in-app contextual navigation.

Messages and notifications

Reaching out to the users and keeping them updated on their bills, orders and payments was one of the most important functionalities of the app. For this reason, the interaction design of this feature had to be explained and visualised thoroughly for both stakeholders and developers.

TNT app

The TNT app is a business-to-business application designed to enable TNT senders and receivers to easily and conveniently stay up to date and track their shipments anytime and anywhere, even when they are on the road.

The main goal of this app is to reduce tracking calls to customer service by creating easy to use functionalities, clear messages and the possibility of answering any question a user may have. Besides, it is focused on the entire journey from sender to receiver, as well as back from receiver to sender in the case of returns, creating a more personal approach than the isolating journey from sender to TNT or TNT to receiver.

Overview

The mobile team consisted of a Product Owner, Scrum Master, UX designer, UI designer (me!), iOS and Android developers and tester, guided by an Agile development approach: continuous fast development, validated by users and stakeholders, allowing us to dynamically adjust to customer demands in delivering features.

The first release of the app included only basic functionalities, such as Track&Trace and an FAQ section, initially to a limited group of users in four countries. This allowed us to start learning from our customers immediately and at an early stage, gathering feedback and tracking usage and KPI’s from the very beginning. This first release was available to iOS and Android mobile phones. The next releases continuously added new functionalities – such as Get a Quote – as well as new device options, such as iOS and Android tablets and Apple WatchOS and Android Wear support, rolling out in 33 different languages (including right-to-left).

My role

I was responsible for the user interface design of the iOS and Android apps, for phones, tablets and wearables.

I worked together with other designers involved in the responsive website and MyTNT environment, but especially with the team responsible for the Track&Trace section of the responsive website, in order to align the user experience and look and feel of the functionality across all different platforms, at the same time translating the flows and components to fit the mobile guidelines and patterns, creating a strong mobile experience.

I also worked together with the marketing team on applying the TNT brand identity on the mobile interface design and creating a style guide, with the developers on specs and deliverables, and with the content team on short and relevant copy for small screens.

Duration

This project took place between September 2015 and March 2016.

THE INTERACTION DESIGN

DEFINING THE MAIN SCREENS AND SECTIONS

For the first release of the app, which included only the Track&Trace functionality and an FAQ section, I and the team took the online experience and backend structure as a starting point to design logical flows and navigation that would suit the iOS and Android mobile guidelines and, at the same time, deliver a strong mobile user experience with an easy to use application.

tnt_sketches
 

 
NAVIGATION

After defining the main sections and steps, we created two journey flows leading from search screen to shipment detail screen. These two flows were prototyped and tested in order to collect user feedback and validate our ideas.

The flow on the left consists in a tabbar navigation structure and a search screen out of which the user can navigate to the other sections – results and shipment detail – in a back and forward pattern. The screen on the right consists in a flow closer to the iOS search pattern, basically starting from a screen with a search field that would slide up to the navigation bar and display the results directly under it.

app_map_1

The flow on the left was the one that users found the easiest and most logical. It was clear in which step of the search they were and how to go back and forward in the flow. Users found the flow on the right to be more difficult. For example, they found it less clear that they had to dismiss the search field on the navigation bar to go back to the search screen, but they saw the persistence of the search feature in all main sections as an advantage of this option.

From this experiment, we also adopted a tabbar navigation for iOS, and a combination of side navigation (drawer) and tabbar for Android, aligned with the guidelines of both operational systems and ensuring usability for both iOS and Android users.

FINDING YOUR SHIPMENT

One of the challenges we faced in this project was the fact that the shipment numbers were not unique, which represented an issue in our vision on creating an easy-to-use app. A provisory solution would consist on displaying a list of results, on which the user would have to find his shipment quick and easily. This list would have to consist of compact rows, displaying only information users need to recognise their shipments. Therefore, a set of options was created in order to validate which information was relevant for each persona in order to recognise the shipment, once this elements would define the visual hierarchy of the design of this row.

Below a few design variations for shipment rows used to validate which information was necessary to quickly identify a shipment.

cards_for_testing

tnt_search_results

USER INTERFACE DESIGN

TRACK & TRACE
tnt_T&T_1
tnt_T&T_2

GET A QUOTE
tnt_get_a_quote

ANDROID PATTERNS
tnt_3
tnt_4

DESIGNED FOR TABLET

tnt_appmap

Sjaak app

Overview

Sjaak is an application that helps groups of friends splitting and settling bills  in a fun and easy manner. This helps users who regularly make expenses in a group where someone pays the bill upfront, and then splits the bill calculating who pays what, and follows up on who has already paid and who still has to pay. The idea behind the app is that it is better if “Sjaak” is chasing the money, sending reminders to your friends after 3 days the amount owed has not been paid, instead of you having to do it yourself.

My role

I was responsible for the user experience for the iOS and Android phones e tablets applications, creating interaction proposals, wireframes and prototypes to be used in user testing, validating results and adjusting designs. Working together with stakeholders and developers following a scrum method, I was also responsible for the visual interface design, creating the visual style and designing all screens and components for the whole application. This also included creating interaction and visual interface documents and deliverables to discuss the interaction with the stakeholders and provide the assets needed to build the app.

Duration

This project took place between April 2014 and February 2015.

THE INTERACTION DESIGN

SKETCH PHASE

In order to define the overall structure, I started sketching on paper some ideas for navigation, functional and interactive behaviours. After that, I create wireframes to quickly test different options without the distraction of visual design and define existing steps required to complete the most general user tasks.

sns_sketch_1

sns_sketch_2

LOW-FIDELITY WIREFRAMES

The first wireframes were high level quick mockups visualising the main screens of the app. These wireframes were useful to define which functionalities would fit each screen, and to give a better overview of the steps a user would have to make when going from creating a new group and adding friends to it, until adding a receipt, splitting it with friends and adding it to the chat group.

First wire main flow

First wire main flow 2

FIRST VISUAL DESIGNS

While testing and adjusting the first wireframes and getting more insight in the user needs and comments, I started creating a visual style to the app. Since the app is functional and has to be easy to download and use, I chose for a flat and clean user interface, keeping each screen simple and intuitive, and trying to avoid offering too many possible actions in one screen, thus splitting long flows in multiple screens.

HIGH-FIDELITY WIREFRAMES

In order to get more user feedback on the interaction and visual designs, I used the most recent designs to create the screens needed to build a prototype using the online tool proto.io. These prototypes showed different navigation paths, interface component and screens designs. The users selected for the tests were asked in many cases to compare different options, taking part in A/B tests. The wireframes below were made in the last phase of the interaction design, and they show an example of high-fidelity wireframes resulting from a long process of creating, testing, validating and improving.

high-fidelity wireframes

high-fidelity flow payment

DETAILED DESIGNS

home screen, create group and settings

Sjaak group and saldo screens

Sjaak chat and receipt screens

Sjaak add new receipts

DESIGNED FOR iOS AND ANDROID

iOS and Android tabbar navigation
iOSxAndroid navigation

iOS and Android toolbars displaying options to add a payment on chat and create a message. On iOS, this bar is located under the navigation bar, while on Android it’s placed on the bottom of the screen. On iOS, the filters appear in a bar that can be toggled from the bottom on the navigation bar. On Android, this filters appear in a foldout menu.
iOSxAndroid chat

sjaak_app

VGZ Mindfulness app

VGZ Zorgverzekeraar (Dutch health insurance company) came up with the idea of creating an app to help people dealing with stress and developing self-consciousness. This is my story of how I made a positive difference to everyday life of people that wanted to achieve a more relaxed and peaceful life through the design of the VGZ Mindfulness Coach app.

Overview

VGZ Mindfulness coach app is an initiative of VGZ for people who wants to have more control over their lives, increase self-awareness and live more here and now. It’s a free application, that contains exercises that teach you how to relax and meditate. Platforms: iOS and Android phones and tablets.

Duration

This project took place between June 2013 and January 2014.

My role

I was responsible for the experience strategy, interaction, visual design and copywriting of the iOS and Android apps, for phones and tablets. I worked together with Beatriz Arias, who designed the initial phase of interaction, and teamed up with the client to understand the concept of the application, define the user stories and apply the VGZ brand identity in the design of the interfaces.

THE INTERACTION DESIGN

In order to define the overall structure of the experience, I started sketching and storyboarding on paper, visualizing ideas about the arrangement of UI, functional and data elements, and interactive behaviours. After that, I create wireframes to quickly test different options of information architecture and layout without the distraction of visual design and illustrate existing steps required to complete a user action.

VGZ mindfulness coach - sketch main screen

NAVIGATION
The use of drawers for the navigation became very popular in this time with Facebook adopting it in it’s app. On my first sketches, I choose to create one button on the main screen through which the user could navigate to other sections, keeping the interface clean and the navigation intuitive in case the user is listening to an exercise and practicing a meditation exercise. However, it was one of the requirements of the client that sections such as about the app, share the app and give feedback shouldn’t be hidden under one “more” section, but visible in a drawer as in Facebook. 
VGZ mindfulness coach - interaction main screen

THE INTERACTION FRAMEWORK
I used Balsamiq Mockup to communicate the app’s interactions, and created animated gif’s in Adobe Photoshop to visualize animations and transitions. These animations and transitions were designed to reinforce context and create an engaging and compelling interface, while keeping it peaceful.

MOBILE PROTOTYPING WITH AXURE RP
Axure proved to be the best tool of choice for prototyping. Because of tight timelines we chose to develop a high‐fidelity prototype already using first versions of interface design, which we also wanted to validate. The prototype was a powerful tool in allowing us to gain feedback from users and approval from both our client and development partner early on.

Prototype_v1
Tapping the main screen shows the track name, audio and volume controllers. After 5 seconds they slide back. Tapping the hamburger button opens the drawer, though which the user can navigate to the other sections of the app. The heart button on the top right opens the favourite list.
Press the hamburger button to navigate

Prototype_v2
The track name, audio and volume controllers are always visible in the main screen. Tapping the hamburger button animates the icons though which the user can navigate to the other sections of the app, including the favourite list. Sections such as ‘about this app’ and ‘give feedback’ could be placed under the ‘more’ section.
Press the hamburger button to navigate

DETAILED DESIGN

The interface design strives to be peaceful, removing unnecessary elements applying necessary elements to be succinct and make sense. The design is uncluttered, clean, large and well spaced. Colors and typography are translated from the VGZ brand and visual identity.

BRAND AND EXPERIENCE REQUIREMENTS
To communicate the personality of the app to our client and team, I visualized many possibilities of applying the VGZ brand and visual identity to create a peaceful interface and experience. Since the beginning of the process, I helped the client understand that both interaction and visual designs should conforme to iOS and Android’s guidelines, as it is recognizable by users of both platforms and is easier scale for future releases.

DESIGNED TO BE PEACEFUL
The main screen has been designed to keep users free from distraction, but allowing them to quick access primary functions of the application. As one of the challenges and requirements was to avoid pushing users to some sort of competition with themselves, I choose to slowly animate a flower on the main screen to engage users on a deeper level, creating an emotional connection. Every time the user enters a new phase of the program, the lotus flower grows in the home screen. This process encourages users to keep completing exercises without stress.

VGZ mindfulness coach - flower progress

NAVIGATION

VGZ mindfulness coach - Home, Menu and Favorites

SELECTING EXERCISES
Selecting and playing exercises should be intuitive, quick and fun. There were four main user cases, which resulted in four flows:
User finishes an exercise and the next can be selected from the main screen
User follows the program and exports to calendar
User selects aleatory exercises from the list containing all exercises sorted alphabetically
User selects based on duration, environment and purpose

design3

TABLET SPLIT VIEW

VGZ mindfulness coach - tablet

VGZ mindfulness coach

Victron Energy redesign

Victron Energy has a strong reputation in inverters, battery chargers and solar products for home, boat and beach/garden – houses. This is my story of how I helped Victron Energy costumers managing a Victron Energy system and being able to see all their sites’ status through the redesign of the Victron Energy app.

Overview

The application helps monitoring and managing a Victron Energy system, allowing the user to see all his sites in a list. Platforms: iOS and Android phones and tablets.

Duration

This project took place between Februari and March 2014.

My role

I was responsible for the interaction and visual design, applying new brand identity to existing phone app and translating the interaction and visual design for tablets.

Redesign

In November 2013, the Victron brand department created a new visual identity for their digital platforms. I was responsible for redesigning the app interface and applying these new visual guidelines to the release 2.0 of the app for iOS and Android, and taking the use of typography into account in order to create an information hierarchy. I also used icons to illustrate secondary information in rows and create visual balance, created diagrams to visualize battery sites.

DESIGN OPTIONS
I visualized many possibilities of applying the Victron brand and visual identity on the new interfaces. These designs were sent to the Victron brand department for approval and feedback.

First design phase
VRM designs phase 1

Second design phase
VRM designs phase 2

NATIVE NAVIGATION
Tapping a site shows its system diagram, current system status and energy flow. Swiping left and right will navigate between sites.

victron_energy_iphone
victron_energy_android

Tablet

This second release was also set to support tablets. I designed the interaction to create the best tablet experience, making sure that all the content remained as accessible as possible when viewed on smaller and larger devices and combining for example site list and detail screen in a split view layout.

Victron Energy Redesign - tablet

victron_energy_ipad

Follow the money

Overview

‘Follow the Money’ (aka Money Tour) is an audio tour that guides you through the financial history of Amsterdam. The tour bridges a period of 400 years, from the Golden Age up until today. Mercurius, the Roman God of commerce, guides you to spots in Amsterdam that played a crucial role in history. The audio tour provides background information of historical buildings and spots that are inextricably linked with the financial history of the city. Platforms: iOS and Android phones.

Duration

This project took place between September and October 2013.

My role

I was responsible for the visual design, applying the Amsterdam Museum visual identity to create the main visual elements, such as color palette and background texture. Creating specifications for image sizes and croppable areas to make them fit screens with audio control- lers and navigation buttons, as well as different screen sizes. Designing the route and POI’s on map view. Worked together with Bea Arias, who designed the interaction and experience.

Money Tour Amsterdam Museum

Money Tour Amsterdam Museum

Boodschapp

Overview

Boodschapp is an application that allows you to compare, quickly and easily, the ingredients and price of products in supermarkets. By simply scanning barcodes, it helps you make the healthiest choice for the lowest price. It is an initiative of Lab1111 and is developed in collaboration with dietitians and nutritionists. Platforms: iOS and Android phones and tablets.

Duration

This project took place between September 2012 and April 2013.

My role

My role on this project was mainly on creating visuals for the release 1.5 of the app, implementing the visual style and identity on the Boodschapp blog, and creating images for Facebook campaigns and newsletters.

The app

For the release 1.5 of the app (on April 4th, 2013), I was responsible for creating new interface elements to integrate new flows, such as signing in and logging in with an account. I also worked on the new ‘favorite’ feature, and created all the visual components needed to indicate which products are marked as favorite on a list, and for adding and removing a favorite product in a product detail screen.

Download the app

bs_slider_1 bs_slider_2 bs_slider_3 bs_slider_4 bs_slider_5

Scroll to view the screens

Facebook images

The Facebook page of Boodschapp is a space for announcements and small campaigns. I created some of the images for this page, using elements of the app to instigate the user to download it and make use of it to check what they eat.

Check the Facebook page

FB-browser 

The Boodschapp blog

The Boodschapp Blog was created using a WordPress template. I used my modest front-end skills to edit the CSS stylesheet and remove some PHP code to bring the visual identity of Boodchapp to the blog and give it the same look and feel of the app and of the website.

Visit the Boodschapp blog

Blog-browser

Superdirect

Overview

Superdirect is an application that aims at helping people to order groceries online and pick them up by simply scanning a QR code in a registered pick-up point.

Duration

This project took place between October 2012 and March 2013.

My role

Responsible for the visual design, applying visual guidelines to create interfaces for the iOS and Android phone applications. Created all icons and used color palette to reinforce navigation and visually differentiate each section of the app. In screens in which products are displayed, pictures should be prioritized, as they communicate faster than description labels.

Superdirect app

TomTom

Overview

During my internship at TomTom, I helped apply the new corporate identity to the website, especially the route planner and support pages.

Duration

The internship program took place between September 2011 and February 2012.

My role

I was responsible for applying the new corporate identity and creating a styleguide for the route planner and support pages. Designed localization-ready experiences, with flexible design to support multiple languages. Participated in usability tests in close collaboration with the interaction designers and user-experience teams.

Route Summary

TomTom Route Summary

Search Error Messages

TomTom Error Messages

Live Traffic update message

One of the features I helped implement in the new release of the website was the Live Traffic toggle panel, displaying updates about traffic information. As TomTom has an international website, a certain flexibility in relation to word lengths in different languages must be considered in the design, which was one of the challenges of this feature and a lesson on creating safe design solutions.

LiveTraffic-animationTomTom - LiveTraffic 

Visual Styleguide

TomTom Visual Styleguide

Design Support Pages

TomTom Support Pages

Infographics

Examples of infographics and (dynamic) data visualization created for mobile applications, websites, roll-up banners and magazines. Playing with typography establishes visual hierarchy and helps people quickly read information. Turning data into visuals improves communication with strong and clear narratives.

Mobile interfaces

Clients: Several | Agency: M2mobi
A series of infographics I created between June 2013 and March 2014 for different M2mobi clients. Some information may have been omitted or changed to comply with confidentiality agreements.

Infographics
Infographics

Schiphol App infographic banner

Client: Schiphol | Agency: M2mobi

In October 2013, the Schiphol app reached a million downloads. In order to celebrate this event, I created this roll-up banner infographic with some nice information collected since the first release of the app, in February 2012.

schiphol_banner_small

Schiphol infographic banner 

TomTom Congestion Index

Company: TomTom

Infographics I made during the internship at TomTom from September 2011 until February 2012, showcasing the congestion levels in cities and continents worldwide. During the first months of the internship, I helped the team create visually appealing infographics that would be used on the ‘TomTom Congestion Index’, a report published each quarter by TomTom, showcasing the traffic knowledge TomTom has about worldwide congestion in cities and continents. This report covers traffic data in continents and cities, resulting on a ranking of congestion levels in urban areas. The visualizations provide more details about congestion level of each city (peaks/ free-flows), the worst weekdays (in morning and evening) and rush hour, worst period morning/evening rush hour, busiest day of the week, busiest day of the period. The European and North American Congestion Indexes can be downloaded at the site TomTom.com every quarter.

Download the Congestion Index at TomTom.com

Some sketches
sketches
Congestion Index for some European cities
congestion_index_animation

TrainDelays

Willem de Kooning Academy, 2012

A visualization of the 5 train options to travel from Amsterdam to Rotterdam Central Stations, considering delays. The idea is to integrate all the information in one visual system, such as a clock that could offer an alternative to the menu systems currently used by most of the smartphone applications.

Train Delay Visualisation

Train Delay Infographic Website Train Delay Infographic Mobile App

The american carbon dream

Willem de Kooning Academy, 2011

A dynamic data visualisation comparing the CO2 emission between the EUA and China.  The fact that the US is a country with one of the highest number of vehicles per person and China has the highest population in the world, I made a comparison by making three questions, that are the links to the animations.

1 – What if the US had the same population as China and continued to pollute with the same proportion of cars per person?
2 – What if China had the same number of vehicles as the US, but with Chinese cars continuing to produce more CO2 than American cars?
3 – How many vehicles would the US have to reduce in order to have the same levels of CO2 emission from vehicles as China?

Click here to visit a larger version

American Carbon Dream Website
American Carbon Dream Data 

Atlas of great power and responsibility

Willem de Kooning Academy, 2011

An Atlas of colonisation between 1500 and 1941. Using an infographic language, it compares the number and areas of colonies with the current poverty distribution in the world. The idea behind it is to question if there are some responsibilities from the rich countries to those that once were colonized.

Atlas of Great Power and Responsibilities

Atlas of Great Power and Responsibilities

Atlas of Great Power and Responsibilities

Atlas of Great Power and Responsibilities

Dutch designers visualization

Willem de Kooning Academy, 2009

An Infographic relating facts about the Dutch Designers – when they were born, where they studied, which design studios they started and who they worked with. Below there is a table with the prizes each artist won and each years.

Dimensions: A0 – 841 x 1189 mm

Dutch Designers Infographic