Re-imaging an editorial legend

Brief

During the re-design of Schroder’s News pages, it occurred to me that the most commonly used component, a generic Card, lacked flexibility and was brand-neutral. With that in mind, I put together the below presentation to persuade Management to allow me to explore what Insights could look like with a new suite of Cards and a new look-and-feel that served to enhance its Editorial appearance whilst improving the overall interaction experience.

Understand what’s needed

Existing live Insights landing page

Position

Insights is a thought leader, providing market expertise and financial guidance.

Problem

After peer research, it was felt that the design of Schroder’s card components were brand agnostic, inflexible and content generic.

Possibilities

  1. Visceral reaction - landing page looks like a calendar or events page

  2. Imagery - stock imagery, confusing background images

  3. Typography - poor legibility, poor signposting

  4. Content - does not reflect the quality of writing and content overall

  5. Brand - currently, Schroder’s brand looks like a festive interpretation of Microsoft’s Metro UI

  • Inconsistent margin widths - page and content look unbalanced and not professional

  • Irregular padding doesn’t look premium

  • On mobile, there is just too much copy, creating cognitive exhaustion

  • Design is not engaging, in part due to lack of editorial content and confusing generic layouts

  • Random coloured backgrounds

  • Layout does not look like an Editorial page

  • Carousel imagery too small

  • Images are bland stock photos

  • Everything below H1 is illegible in carousel

  • Too many font weights affect scannability

Review of Schroder’s Insights page + Analysis of Card component designs:

Schroder’s Insights review

Peer analysis

New Dashboard design

  • When Schroder’s card components were placed amongst its peers, its brand was lost.
    This was the springboard that drove the redesign of the entire page.

Key learnings

  • Visual language - Doesn’t feel like it’s part of Schroder’s visual family

  • Visual affordance - The page looks like a date-led Events page

  • Not premium - Design does not reflect the quality of its content

  • Photography - Generic stock imagery

  • Limited components - We need larger number of flexible Card variations

Final designs

  • Visual language - New design can be scanned

  • Visual affordance - Page looks like an Editorial page

  • Feels more premium - New font, colours, layout and graphical enhancements reflect the quality of content

  • Photography - Carefully chosen, hand-cropped

  • Improved components - Cards for imagery, text and imagery, video and text etc, etc.

Contact me