KU Brand

I met with Kansans, alumni, students, faculty and staff. I asked open questions about identity, traditions and how they feel about KU, then looked for patterns.

What worked

I mapped the content people needed most and grouped the guidelines to make sense. I proposed layouts and turned brand rules into usable components.

1. Step 1

   Map the content

   I listed what people look for most.

2. Step 2

   Group the guidelines

   I put related rules together.

3. Step 3

   Propose layouts

   I turned the rules into page layouts and components.

The refreshed brand became a digital system. It defined how logos, colors, typography and spacing showed up across the site. This graphic shows the core elements in the brand colors.

“Towering Toward the Blue” comes from a line in KU’s Alma Mater. It became the brand platform for how KU looks, sounds and feels. The logo, Jayhawk and crimson and blue stayed. We checked each design choice against it.

I started with boxes and added detail one layer at a time. Each step answered one question before the next began. I kept the early steps grey on purpose, so we discussed structure before color.

1. 1

   Boxes only

   I drew boxes and labels, with no color and no real text. This showed the order and size of each block: the hero, positioning, goal and four guideline cards.

2. 2

   Grey wireframe

   I added the real navigation, headings and copy. The slogan was the main text in the hero. Now we could check the hierarchy and the reading order.

3. 3

   Brand frame

   I added the holding box and pinpoints from the graphic elements. They showed how the brand frame sits on the page.

4. 4

   High fidelity

   I added photos from the Brand Center, Kansas Blue and Crimson. Some layouts looked clean at this stage but felt hard to use, so I kept checking them against the grey versions.

1. Decision 1

   Keep the two core colors

   Kansas Blue (#0051ba) and Crimson (#e8000d) stayed, the colors people already knew.

2. Decision 2

   Name every color

   Each color got a plain name, like Night, Lake and Sky, so everyone used the same words.

3. Decision 3

   Never rely on color alone

   Every pairing passed a contrast check first. We listed the pairings to use and the ones to avoid.

4. Decision 4

   Pick type by job

   Roc Grotesk and Moret for headlines. Gotham Narrow or Freight Text for body. KU’s rule set web body text at 12 to 16 px.

5. Decision 5

   Use the grid and frames

   Square grid units for layouts, a thin Fire line for holding boxes, Lake dots for pinpoints.

6. Decision 6

   Write in the brand voice

   Active voice, present or future tense, and “toward” instead of “towards”. We kept tower images rare.

--ku-blue: #0051ba;     /* Kansas Blue, primary */
  --ku-crimson: #e8000d;  /* Crimson, primary */
  --ku-night: #003459;    /* text on light blue */
  --ku-lake: #2767ff;     /* links, pinpoints */
  --ku-sky: #73cbf2;
  --ku-steam: #dde5ed;    /* page tint */
  --ku-fire: #ff3042;     /* holding box line */
  --ku-brick: #971b2f;
  --ku-text: #333333;
  --space-unit: 8px;      /* square grid unit */
  --text-body: 16px;      /* web body: 12 to 16 */

Focus groups and A/B tests of early concepts showed what was not working yet. They raised concerns about tone, the order of importance, and how people would really use some concepts.