Connor Jarret's Lab Notebook

Lab Notebook has a new and more responsive look

I spent a week redesigning Lab Notebook to be more responsive - here's what's new.

Lab Notebook may be less than 2 months old, but me being me, I've already found thousands of ways to change the appearance of it. This week I shipped Lab Notebook's biggest overhaul since I released it, and I'm going to break down some of those changes, why they matter and my design process.

The new Lab Notebook Logos

The new Lab Notebook logo was designed to reflect the new, more rounded and friendly user interface. The old logo used a Monospace font and hard sharp corners, whilst this logo reflects the new Mona/Hubot Sans typeface and adopts rounded corners in the icon.

The new User Interface

The old Lab Notebook user interface compared to the new one.

The new user interface does a lot in rounding off the corners and making content more readable and accessible. Some of the key changes include:

Black tones on articles have also been adjusted to create a softer/lighter shade depending on importance without standing out.

As well as this, the homepage has been updated to have multiple sections rather than just an "All Articles section"

Design Process

The Figma layout of the design process of Lab Notebook Logos

The design process for the Lab Notebook logo took lots of consideration and failed attempts. The first logo introduced the black and white colour scheme that is still present now, but it was based heavily on monospace fonts and overall had a very clunky appearance.

The new logo tries to change that by opting for rounder corners and a different, softer typeface. The wordmark was altered to not take up as much horizontal space, and also to make "Lab Notebook" the main focus, rather than "Connor Jarrett". The favicon was also adjusted to go from black text in a white circle, to white text in a black rounded square.

What's next

Lab Notebook will always be changing, after all, it's my development playground for experimenting with new tech and features. I've been thinking of building some new accessibility features to make reading long, unbroken lines of text easier, but it's still under development. For the past week I've been trying to organise things for some great collaborations, but right now it's all unconfirmed and still in the research phase. If you're interested in collaborating, you can contact me on Twitter @ConnorJrt or email me at

If you enjoyed this article please consider sharing with a friend