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.
What’s needed?
Old Insights landing page
Position
The Insights page 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
Visceral reaction - landing page looks like a calendar or events page
Imagery - stock imagery, confusing background images
Typography - poor legibility, poor signposting
Content - does not reflect the quality of writing and content overall
Brand - currently, Schroder’s brand looks like a festive interpretation of Microsoft’s Metro UI
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
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
Review of Insights page + Analysis of Card component designs
Insights review
Peer analysis
Insights review
New Dashboard design
When Schroder’s card components were placed amongst its peers, its brand couldn’t be recognised
This realisation was the springboard that drove the redesign of the entire page.
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
Enhancements
Visual language - New design can be scanned easily
Visual affordance - Page looks like an editorial page
Feels more premium - New font, colours, layout and graphical enhancements
Photography - Carefully chosen, carefully cropped
New components - Cards for imagery, text and imagery, video and text
Conclusion + Results
Being given the opportunity to design something like this was an honour and immensely rewarding. This exercise showed the HoD and HoUX that there was room for a lot of improvement.