Work · 2013–2014

Hospital International Management

Hospital International Management helps hospitals run themselves, trains people in diabetes and prevention, archives data and surveys patients. That much on offer needs a presence that sorts before it explains. We built a mark, a website that stays just as clear on every screen, and an iPad learning programme that helps people with diabetes understand their condition.

Services
  • Combination mark
  • Stationery
  • Responsive web design
  • Interface design for iPad
Year
2013–2014
Close-up of a screen showing the Hospital International Management website: in turquoise, the tagline “Delivering Excellence in Healthcare Management. Worldwide.” on a light background
Starting point

Hospital management, diabetes training, long-term archiving, patient surveys: HIM works everywhere from the director’s office to the bedside. For hospitals in many countries it should all feel like it comes from one source, modern enough for digital products, serious enough for medicine.

So the first thing wasn’t a leaflet but a mark that captures the long name at a glance.

Mark

Three words, three initials, one shared stroke: the I for International stands in the middle and belongs to both neighbours. The initials say what the company does. It connects across borders.

Beside it the name sits on three lines, in a narrow, rounded typeface that works as well on letterhead as it does on screen.

HospitalInternationalManagement9.699.699.699.284.814.8122.94Height = 100
  1. 01 / 04Three letters, one shared stroke. Hospital, International, Management: the I stands in the middle and is at once the second stem of the H and the first of the M. You see HM and read HIM.
  2. 02 / 04One stroke carries it all. Stems and middle stroke are equally thick; only the crossbar is a touch thinner, because horizontals otherwise look heavier. That keeps the mark in balance.
  3. 03 / 04Space makes the I visible. Crossbar and diagonal stop half a stroke short of the I. Only that gap lets it stand on its own instead of dissolving into its neighbours.
  4. 04 / 04The type takes the measure of the mark. The first capital starts at the top edge of the mark, the last baseline sits on its bottom edge. Image and word are the same height and read as one block.
Website

Anyone running a hospital isn’t looking for entertainment but for someone to talk to. So the website shows five categories, and the home page says in one sentence what HIM works for.

From desk to phone, the arrangement changes. Never the order.

HOMEPRODUCTS & SERVICESABOUTNEWSCONTACTDelivering Excellence inHealthcare Management.Worldwide.WELCOME TO HOSPITAL INTERNATIONAL MANAGEMENTDelivering Excellence inHealthcare Management.Worldwide.WELCOME TO HOSPITAL INTERNATIONALMANAGEMENTDelivering Excellence inHealthcare Management.Worldwide.WELCOME TO HOSPITALINTERNATIONALMANAGEMENTDesktopTabletPhone
  1. 01 / 03Five categories, one line. The whole offer fits into one navigation bar. Anyone running a hospital finds what they need in seconds and always knows where they are.
  2. 02 / 03Narrower, not different. On the tablet the navigation folds into a menu, heading and text move closer together. Tagline, image and order stay put. Nobody has to search again.
  3. 03 / 03One column on the phone. On the smallest screen everything stacks up, with the brand on top. The home page reads as clearly on the move as it does at a desk.
Close-up of the navigation: “Home” in white on an orange field, next to it “Products & Services” in grey, with the mouse pointer on it
Learning programme

In the United Arab Emirates, one in five people has diabetes. Those who understand early what the condition means live better with it. That is HIM’s approach: prevention through education.

For the iPad we designed a learning programme that informs and entertains at the same time. It takes patients by the hand instead of pressing a brochure into it.

ChaptersWhat is diabetes?Managing type 2diabetesOverweightTherapyExerciseNutrition adviceCooking studioRelated andsecondary conditionsManaging type 2 diabetesSTARTManaging type 2 diabetesYou measured your blood sugar before dinner,and it is extremely high (382 mg/dl or 21.2 mmol/l).What could be causing this?4 correct answers (multiple choice)Not enough blood was put on the teststripYou ate a carrot shortly beforeYou didn’t wash your hands and hadtraces of sugar on your fingerYou drank very little before measuringQuestion 5Managingtype 2 diabetesNEXT QUESTION40%3CHAPTERSCOMPLETEDCongratulationsENDDoctorDoctor
  1. 01 / 04Chapter by chapter. From “What is diabetes?” to secondary conditions, in manageable chapters. A tick shows what’s done. Nobody has to learn everything at once.
  2. 02 / 04Watch first. Every chapter starts with a short film. Someone who has just been diagnosed grasps a picture faster than a paragraph of jargon.
  3. 03 / 04Then answer. Then the programme asks questions, one per screen. Answering fixes what you’ve learned and shows you where you’re still stuck.
  4. 04 / 04The result goes to the doctor. At the end you see how much is done. The answers go to the treating doctors. They see sooner where knowledge is missing and can ask the right questions.
Interface

The learning programme speaks the same language as the website. Anyone who knows HIM recognises the training, even without a logo on every screen.

The answers are wide areas instead of little boxes. People who rarely use a tablet should be reading, not aiming.

Five screens of the learning programme side by side: a result of 40 per cent with “Herzlichen Glückwunsch” (Congratulations), a question about measuring blood sugar with five answers, in the middle the start screen “Patient Info Net – Herzlich Willkommen” (Welcome), a question with a progress bar, and a number pad with “Nächstes Kapitel starten” (Start next chapter)
Five screens, one style.
Next
Next projectSanofi

Planning something similar? info@vertikahl.com