An independent archive of typography.
Topics
Formats
Typefaces

DrugBank

Contributed by Production Type on Sep 28th, 2021. Artwork published in .
DrugBank 1
Source: www.educedesign.com License: All Rights Reserved.

DrugBank is an online database containing information on pharmaceuticals. The website is conceived as a practical tool for anyone who wants to have specific information about the medication they are about to use. At the same time it offers a technical and scientific approach to them: DrugBank is a bioinformatics and cheminformatics resource, making it an important online space for research. The resource is free to access, except for certain particular cases where a licence is required.

The web application underwent a redesign in 2017. The team of Educe Design & Innovation was in charge of this overhaul. Their challenge was to keep the structure and basic interactions offered by the initial interface in order not to disturb the users’ habits too drastically. Therefore, the redesign is mainly a visual one, and has focused on solving the platform’s issues around repetition and inconsistencies. In order to be adaptable to any format, the design is modular, and plays with the agency of its elements to be redistributed. The identity relies on the strong association of neon pink, black and white, which makes the database identifiable, legible and relatively sober at the same time. Some other primary colors are used for minor categories, and offer even more clarity. A big work was done on the pictograms, which in a database conceived as a list of texts, play a crucial signage role.

The designers used Gemeli from Production Type for the integrality of the database’s textual layer: the family’s wide range of weights and its optimized legibility make it a perfect typeface for this kind of encyclopedic use. On the other hand, Gemeli is not as straight or dry as most typefaces we see on package leaflets from medicinal products. It’s spaced more loosely, and reminds of some aspects found in Antique Olive – but with less contrast. This makes the content of the website more accessible and easier to appropriate, particularly for regular users.

DrugBank 2
Source: www.educedesign.com License: All Rights Reserved.
DrugBank 3
Source: www.educedesign.com License: All Rights Reserved.
DrugBank 4
Source: go.drugbank.com License: All Rights Reserved.
DrugBank 5
Source: go.drugbank.com License: All Rights Reserved.
DrugBank 6
Source: www.educedesign.com License: All Rights Reserved.
DrugBank 7
Source: www.educedesign.com License: All Rights Reserved.

Typefaces

  • Gemeli

Formats

Topics

Designers/Agencies

Artwork location

Post a comment