Google Calendar is designed to work across mobile, tablet and desktop. It automatically brings in any reservations you made, and has many more features you can read about here.
Redesigning Calendar across all platforms and form factors meant organising its key components — time grids, events, date pickers, etc — for radically different layouts and input modalities.
We brought in illustration from artist Maya Stepien, Lotta Nieminen and Owen Davey to create unexpected moments of joy, but more importantly, to aid the eye in scanning the diary.
Lotta’s seasonal canvases — January through December — use colour and form to create a seasonal narrative that accompanies the user through the year.
Lotta’s characters swim with the sharks in summer, harvest fruit in autumn, ski alongside polar bears in winter and roast marshmallows in spring. The canvases are offset by six months in the north and south emisphere to account for the seasonal differences across the globe.
As we asked Lotta to design for both tablet and mobile, I had to define a template that would allow the illustrations to integrate well with the UI across both form factors, keeping UI areas clear from characters and other key items.
The template enabled Lotta to design while seeing the work across a number of form factors, driving quicker review cycles and allowing us to focus on more interesting creative details.
We collaborated with illustrator Maya Stepien to create illustrations for 100+ event types. These are automatically added to events, matching their titles.
Maya’s elegant geometric shapes, bold use of colour and negative space create iconic illustrations that make key events stand out in the diary.
Art directing this set had a couple interesting challenges. Firstly, keeping diversity in mind, both from an activities perspective, but also in the way we chose to represent such activities.
Calendar illustrations celebrate St. Patrick’s Day, Quinceanera, Nowruz and Pride. We chose never to represent humans at this scale, given the challenges in keeping the set diverse — and instead focusing on the key items that represent such activities.
Additionally — in order to keep the set feeling cohesive as it grew — we focused in using two viewpoints (front and top-down) and colours from Google’s palette.
For a more experimental design — Goals in Calendar — I worked with illustrator Owen Davey, who created for us a set of 5 canvases narrating of people intent in their everyday life.
Together with Calendar's historical set, Owen's images accompany the user in their journey towards setting up a routine.
The five canvases — Exercise, Build a skill, Friends & family, Me time, Organize my life — inspire people to visualize themselves working towards their goals. Owen’s artwork fosters discovery, helping users explore the variety of goals we curated in the app, from getting healthier, to dealing with chores, and staying in touch with people who matter in your life.
Similarly, Maya’s illustrations walk the users through the goal set-up process, helping them focus on key aspects of the activity (I need a brush and some canvas before I practice painting, for example) from visualization and mental preparation, to action. These same illustrations surface throughout the whole goal cycle, visually nudging users, and helping them build their routine, day after day.
With 24 timezones to contend with, time flowing from left or right — depending on the language you speak — different time formats depending on the country you’re in, time can be represented in many ways.
Data density — the amount of events per week — also plays a key role in the calendar view a user might choose: Schedule, Day, 3-Day, Week, Month.
I designed a site to outline interaction and data formatting specifications.
The site covers UX and UI specifications for all views, a design system for Event Chips across all views, primary and secondary user flows, as well as motion studies.
Streams is a mobile alerting app, designed for nurses and doctors in hospital. Streams enables clinicians to monitor their patients' vitals on the go, and get alerted for Acute Kidney Injury, vital signs changes, Sepsis and Covid-19.
Streams is developed by Google Health.
A combination of the National Early Warning Score and alerts enables a clinician to quickly assess their patients' trend and spot any issues worth investigating further.
Patient information including date of birth, hospital number and location allow for identification and follow-up.
The list is now made by the intersection of any clinical proxy the user chooses — e.g. All patients in Diagnostic Medicine under Dr. House. This enables nurses to focus on patients in a given location, or consultants to select patients within a specific specialty and under one or more consultants.
Grouping patients by location — rather than alphabetically — facilitates routines like the ward round where clinicians assess patients in a specific location-based order.
The badges, coloured by the score parameters set by NEWS, show the patient's latest NEWS score with a trending arrow to indicate whether they're worsening or improving.
NEWS scores range 0—20+ and are divided in four risk bands, colour-coded with a traffic light system. Scores 0—4 are low risk, colored in grey, or yellow where a single parameter is scoring 3; 5—6 are medium risk, in orange; 7 and above are high risk, in red.
The trend arrows are a key piece of information, as they communicate to the clinician whether the patient is worsening or improving.
For example, a critical patient, recently reviewed, might be improving while still scoring high. Conversely, another patient might have recently worsened quickly requiring a fast follow-up.
We introduced Streams Design System to support the growth of the product at speed, across platforms. A single, flexible, component can handle most of the app's layout needs, providing consistent hierarchy throughout.
The Streams Tile was designed in tight collaboration with our engineering team to ensure design requirements would be met in implementation, and vice-versa ensure we kept the design simple to implement.
This approach led to many benefits, including enabling Dynamic Type across the app as well as making data ingestion simpler.
I explored what a table chart displaying a patient's vital signs might look like.
The coloured blocks create a visual map of the vitals, highlighting areas of concern and indicating stability or sudden change.
Four sets of values — normally covering the patient’s last 24h — allow for comparison over time.
The Google Health team in London is a diverse crowd of backgrounds. As many might not be familiar with the hospital environment, I designed a set of 11 posters to bridge that gap, and help create empathy for our users.
I designed this pair of posters to communicate some of the tools clinicians use to assess and monitor the conditions of in-patients. The ABCDE approach helps health-care professionals to focus on the most life-threatening clinical problems, while vital signs are recorded to monitor a patient's trend, highlighting any early signs of deterioration.
Common across hospitals in the UK, the National Early Warning Score chart (below) helps standardise the assessment and response to acute illness. While relying on manual input, this impressive piece of design manages to visually outline a patient's trend in both overview and detail.
This set of posters tries to paint the change between the hospital from daytime to out-of-hours. What's the impact of attention fatigue while each clincian is responsible for more patients?
Out-of-hours hospitals have not only less nurses and doctors covering the many patients. Support staff like cleks, pharmacists, specialist nurses are also less or not available at all.
Plebiscitum — Latin: people's choice — is a card game I designed with some friends while doing my master in Interaction Design.
Based on the political events at the time, Plebiscitum is designed to foster constructive and destructive team dynamics. The players, organised in Parties are encouraged to gain as much Popularity as they can, balancing their own success while keeping in check both their enemies and allies.
While we only had two weeks to design a game prototype and test it, I liked the outcome so much I took it as an opportunity to refine it and make it a finished product.
I personally designed the illustrations for 100+ cards, the graphic system and all the collateral assets for the game.
The backbone of Plebiscitum is the idea that players should try to make their own party win, and at the same time beat their own party members in order to get elected.
To do so, players can play cards both against other parties’ members or against their own party members.
Players can use powerful Negative Action Cards during their turn. You may be able to frame your political opponent, or gain a lot of dirty money.
For example, the Approve Illegal Construction card allows you to gain quite some money in a single turn, while the Frame card allows you to move one of your previous shady actions to someone else.
These actions become a player's skeleton in the closet, risking to expose them to the public for what they did, eventually losing all the popularity they had gained.
For example, event cards such as Wikileaks reveal all players’ Negative Action Cards, making them pay for all the bad deeds they did.
Mythology has always fascinated me. De Vliegende Hollander is an exploration of graphic studies I made while studying.
It is a common superstition of mariners, that, in the high southern latitudes on the coast of Africa, hurricanes are frequently ushered in by the appearance of a spectre-ship, denominated the Flying Dutchman... The crew of this vessel are supposed to have been guilty of some dreadful crime, in the infancy of navigation; and to have been stricken with pestilence... and are ordained still to traverse the ocean on which they perished, till the period of their penance expire.
— John Leyden
The weather was so stormy that the sailors said they saw the Flying Dutchman. The common story is that this Dutchman came to the Cape in distress of weather and wanted to get into harbour but could not get a pilot to conduct her and was lost and that ever since in very bad weather her vision appears.
— John MacDonald