Design Notes

Notes on design work.
All notes
Entries: 2

A list of things I found pretty useful when researching how to build and steward a design system at the Media Lab Bayern. Please note that this project did not include a component library of code base, which is why these recommendations won‘t touch on these subjects

Books

Expressive Design Systems (2019) von Yesenia Perez-Cruz, A Book Apart [Link]

  • Absolutely excellent book when it comes to the implementation, structuring and stewarding of a design system.

Articles

Creating Etsy’s Design Principles

  • Helpful example of what design principles might look like and how to write them (it involves a lot of back and forth with stakeholders)

Tips For Managing Design Systems

  • A couple of rather basic but important tipps for implementing and stewarding a design system.

Picking Parts, Products & People

  • This is a neat little team exercise for figuring out which parts your new design system actually needs

READ ➞

These are a couple of notes about building and managing a design system at the Media Lab Bayern.

The updates are written in reverse chronological order with a date added to each.

  1. Preparations
    1. First experiments
    2. Research (a.k.a Talking to people)
  2. Context setting

Preparations

First experiments

2022-12-19 With the holidays drawing closer, here are a couple of updates:

  1. We have a somewhat complete list of all the relevant parts of the design output of the teams. It currently packs 63 items from colors and fonts to office signage, contracts, social posts, and merch. There‘s a lot of stuff we‘re producing in a given year.
  2. I experimented with Notion as home for the new design system based on the Design System Template from the gallery. Conclusion: It‘s a pretty nifty tool or how our head of marketing put it “I love it ❤️”.
  3. I started a typography audit, starting with our marketing slide template. It‘s, to be honest, a bit all over the place. The goal is to define a new typography system based on size ratios, instead of the fixed pixel sizes, currently in use.

With the preparations now complete, the project will “officially” launch next year with the rest of the team. The next steps will be:

a) Gathering feedback from the team on the design audit (what works / where are question / what needs to be updated).

b) Identify the biggest redundancies and gaps and strategize how to resolve them within the team.

Current artifact: a couple of tables in numbers, able to auto-generate new type scales based on the font size of a basic paragraph.

Research (a.k.a Talking to people)

2022-12-07 During chats in the team we got more information on the history of design at the lab. Especially the last brand refresh at the end of 2021, which introduced elements and colors for the different programs and thus expanded the visual language.

One thing that keeps coming up is the focus on slides as one of the main medium for presenting the lab to stakeholders, startups and potential partners (a close second is the website), which is why these are the most mature design artifacts the teams uses.

With the lab having almost doubling in head-count over the last 18 months there‘s a lack of awareness for the brand guidelines and CI. One thing, we briefly discussed, was the apparent need for a design on-boarding for new hires.

Context setting

2022-12-05 We kicked-off this project in December 2022. At this point the Media Lab has existed for almost a decade and grew from two people to ~25 at two seperate locations.

During this time, the CI also grew but was never formalized beyond a collection of graphic elements, fonts and powerpoint slides.

As a consequence the consistency and quality of the design output varies wildly. While every colleague produces design work in varying quantitities, the Lab never employed a dedicated designer. Most high-quality work is done by a lead-agency which also created the CI in the first place.

What we‘re trying to do is to grow the existing CI and build a small design system. Meaning, we‘re not trying to define every use-case in a fixed document and then police the team but to create tools they can adopt creatively for their needs. Additionally we want to implement a stewardship process that enables us to periodically check in with the system to optimize, correct or discard elements.

At this point we have a cautious “go!” from the team leads and already did some preliminary research and alignment work (a.k.a. talking to people).

The next steps:

  • Create a design inventory (and overview over the complete output of the team)
  • Let the team give feedback on this inventory (What works well? Where do we need more guidelines? What can be ignored at the moment?)

Both of these steps will hopefully help us define a roadmap for the next months and give us some clarity as to where the biggest problems lie.

READ ➞