Page tree

Versions Compared


  • This line was added.
  • This line was removed.
  • Formatting was changed.


Page properties

TitleDiscovery title
GoalThe discovery goal
Pivotal story



  1. Make an adjustment to all the font size across all breakpoints
  2. Second recommendation
  3. Third recommendation
  4. And so on...


The actual discovery work, split into clear subsections where necessary.


Before we begins looking at the recommended solution, let's try to understand why we need to make changes to our current Lens system. 

First thing we want to look at is to bench mark with the others to see if we are really being a bit large on our typography? Here is out finding: 

  1. Our typography is considered as large comparing our benchmark. According to this wiki page finding. 
  2. It is understandable that a website that is required to convey a large amount of message to audience will need a good typography hierarchy. Looking at the headings, the h1, h2 and h3 styles that editors can use in markdown buckets is a different size to the equivalent CMS heading tags in, for example, in a section heading, a h1 tag is 32px while a markdown-h1 is 28px.

 However, there is no usage scenario where:

  1. Editors add markdown-h1 or markdown-h2 underneath a CMS h3 tag. 
  2. Editors add markdown-h2 underneath a CMS h2 tag

. In most cases, the headings markdown bucket sits within a section which means there is no real need to set up a different levels for both sets of headings. They are the same levels of h1, h2, h3 which sits within section heading. 

Secondly, we want to look at proposing some new set of typography that would still work well with out live pages but at the same time a lot smaller for the ease to read. 


Let's try to do some Math to help my design eyes make more sense, okay

What is modular scale?

Have you heard about the so-called golden ratio or golden mean? In ancient Greek philosophy, it was also known as the golden middle and was representing the desirable middle between two extremes.