{"id":454,"date":"2018-04-26T16:56:00","date_gmt":"2018-04-26T16:56:00","guid":{"rendered":"https:\/\/www.embl.org\/about\/info\/communications\/?p=454"},"modified":"2021-10-11T11:55:02","modified_gmt":"2021-10-11T11:55:02","slug":"joining-the-design-sprint","status":"publish","type":"post","link":"https:\/\/www.embl.org\/about\/info\/communications\/blog\/2018\/04\/joining-the-design-sprint\/","title":{"rendered":"Joining the design sprint"},"content":{"rendered":"\n

I\u2019ve spent my first month at EMBL settling in, meeting talented people, and working out how the various digital projects that StratComm has planned will fit together.<\/p>\n\n\n\n

We have a whole host of digital objectives – revamping embl.org, improving the intranet, fixing Search, creating a unified theme for EMBL websites, making EMBL services easier to navigate, to name a few \u2013 and they overlap and interact in various ways.<\/p>\n\n\n\n

A key part of building a clear digital identity for EMBL will be robust, consolidated branding.<\/p>\n\n\n\n

This month I was lucky enough to spend time on a Design Sprint led by EMBL Art Director Tabea Rauscher. Tabea leads the design team here in Heidelberg, and works closely with EBI Senior Graphic Designer Spencer Phillips and Web Design Architect Ken Hawkins.<\/p>\n\n\n\n\n\n\n\n

Goals<\/h2>\n\n\n\n

We wanted to test the EMBL logo and corporate colours in various media, and think about how the EMBL brand could be adapted to work for assorted digital tools. We hoped that the sprint would help us better to understand strengths and weaknesses of our chosen typography, colours and visual elements.<\/p>\n\n\n\n

Logo and colours<\/h2>\n\n\n\n

I spent a morning shadowing Tabea, who tested the EMBL logo in various configurations and combinations against different backgrounds and colours. I was struck by how much of a designer\u2019s work is to solve problems in a structured and analytical manner. Graphical elements that work well online can fail in print and vice versa.<\/p>\n\n\n\n

One example of a design problem to solve is how and where to incorporate sub-branding for EMBL\u2019s various sites. At a recent Heads of Units meeting, management and key stakeholders agreed that the brand strategy should be \u201cEMBL First\u201d, with EMBL\u2019s sites as sub-branding. This creates a visual problem: \u201cEMBL Rome\u201d and \u201cEMBL \u2013 European Bioinformatics Institute\u201d look very different on the (web)page. How to integrate these sub-brands? Work is still in progress.<\/p>\n\n\n\n

Read Tabea\u2019s account of this sprint<\/a><\/p>\n\n\n\n

Posters<\/h2>\n\n\n\n

Spencer tested EMBL branding, typography and templates for various text-heavy poster options. How does typography work at various sizes? Which typography hierarchy is most effective, allowing readers to quickly scan the information they need? Spencer\u2019s work gave us strong options for poster templates, and led to discussions on typography, and the idea that the Fira typeface may need to be tweaked to fit the needs of EMBL designers.<\/p>\n\n\n\n

A toolbar for EMBL?<\/h2>\n\n\n\n

I worked with Mark to hash out ideas for a unifying branding element for EMBL\u2019s various websites. We thought that a toolbar across the top of EMBL\u2019s webpages could work well.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

An EMBL toolbar could provide the following functionality:<\/p>\n\n\n\n

A branding element for EMBL<\/h3>\n\n\n\n

The \u201cEMBL\u201d at the top of the screen in the toolbar, with the full logo relegated to the bottom right of the screen, as a badge. This frees up the space at the top left of screen – below the toolbar – for sub-branding such as \u201cEMBL Rome\u201d, \u201cEMBL Grenoble\u201d, \u201cEuropean Bioinformatics Institute\u201d etc.<\/p>\n\n\n\n

A link back to http:\/\/www.embl.org<\/a><\/h3>\n\n\n\n

Users always have a way home if they get lost or confused navigating EMBL\u2019s subdomains.<\/p>\n\n\n\n

An \u201cExplore\u201d link for external users<\/h3>\n\n\n\n

This could provide simple, clear navigation to commonly used EMBL sites: Topics \/ Themes \/ Locations \/ People \/ Research Groups \/ Jobs \/ Contact\u2026and so on. Links will be chosen based on analytics from existing EMBL sites.<\/p>\n\n\n\n

A \u201cSign in\u201d button for internal users<\/h3>\n\n\n\n

A Single Sign-On system from the toolbar could take EMBL users to a \u201cSpringboard\u201d; a personalized, curated list of important intranet links, chosen based on user needs.<\/p>\n\n\n\n

A working Search function<\/h3>\n\n\n\n

In early user research for EMBL\u2019s digital projects, the most consistent feature request from users was to fix Search. It should be easy to find anyone or anything at EMBL from a toolbar search.<\/p>\n\n\n\n

Ken spent the day building a prototype toolbar, which helped to focus discussions.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Next steps<\/h2>\n\n\n\n

We will be integrating these and other design ideas into a wider EMBL design language. Branding for EMBL is a work in progress and we will no doubt iterate and change some of these designs along the way. Watch this space and post a comment if you have any questions.<\/p>\n","protected":false},"excerpt":{"rendered":"

I\u2019ve spent my first month at EMBL settling in, meeting talented people, and working out how the various digital projects that StratComm has planned will fit together. We have a whole host of digital objectives – revamping embl.org, improving the intranet, fixing Search, creating a unified…<\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1832,1],"tags":[476],"embl_taxonomy":[],"class_list":["post-454","post","type-post","status-publish","format-standard","hentry","category-digital","category-general","tag-corporate-design"],"acf":[],"embl_taxonomy_terms":[],"featured_image_src":"https:\/\/www.embl.org\/about\/info\/communications\/wp-includes\/images\/media\/default.svg","_links":{"self":[{"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/posts\/454","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/comments?post=454"}],"version-history":[{"count":2,"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/posts\/454\/revisions"}],"predecessor-version":[{"id":572,"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/posts\/454\/revisions\/572"}],"wp:attachment":[{"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/media?parent=454"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/categories?post=454"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/tags?post=454"},{"taxonomy":"embl_taxonomy","embeddable":true,"href":"https:\/\/www.embl.org\/about\/info\/communications\/wp-json\/wp\/v2\/embl_taxonomy?post=454"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}