History
Easily accessible content was the highest priority with A&E’s History site design, emphasizing clean layouts and simple fonts to bring the educational articles and videos front and center for their readers.
My Role:
As a Creative Designer at Say Media, I took on the responsibility of presenting web design strategies to key publishers, and aligned client requests with product capability to create beautiful media rich experiences. I was the sole designer on these projects, and I was responsible for layout creation, fonts and colors, as well as user experience strategy.
Main Goal:
History’s readership was heavily weighted towards students using this site for research, so we needed to make sure that readers could find what they were looking for quickly, that articles were well organized, and important content could be called out.
Font exploration snapshot.
Overall Look:
I wanted to go with minimal and modern fonts to keep the reader focused on the content. I didn’t want to distract from the beautiful historical images that made History’s site so rich and intriguing. I explored a mix of san-serifs and serifs, and ultimately was really drawn towards a lean, condensed look for the headlines. Here’s a snapshot of my font explorations for the site.
As far as colors go, I kept it simple with black and white, with pops of red for CTA’s, links and hovers effects.
Site Structure:
There were three main areas of the site that needed to be designed: Topics, This Day in History, and Stories
History’s “Topics” pages and “This Day in History” were important to get right, because they received the most page views and kept a loyal following. These areas of the site housed the majority of the educational articles that the readers were after.
The “Stories” section of the site was aimed more for light-hearted reading, so the strategy behind this part of the site was more about placing fun editorial pieces up front.
Topics:
History’s “Topics” needed to categorize a wide variety of articles surrounding big historical events, making it a breeze for readers to find what they were looking for.
History wanted all their topics to be visible, so my solution was to group big topics together in alphabetical order, and leave four programmable heroes at the top of the page to allow for the editor’s to customize what belongs there. With this layout, I was able to keep the page simple and clean while still calling out major events and subjects.
Each topic had its own detail page, which housed a lot of information. To accomodate for these lengthy, in-depth articles, we designed a table of contents component to sit at the top. Each link anchors to the headlines of the story, making it effortless to set up for the editors. The table of contents component made the Topics detail pages easily scannable and helped to limit search time.
This Day in History:
This landing page houses an article about an event that took place each day of the year. Every day a user clicks on this tab, a new relevant story about the date will appear.
This was a very engaging page for History’s readers, as they tend to stay curious and always come back for more. We needed a way to let readers go forward and backwards in time to keep them entertained after the initial read of the day was over.
I assisted the team’s product designer with a date picker design to solve this. A reader could simply click on the date shown, and a calendar would drop down below prompting them to pick any day of the year. This worked on all screen sizes, and created a non intrusive way for readers to stay engaged.
Stories
My idea for this landing page was to highlight the main stories with big image heroes that capture the attention of the reader. I really wanted to show off the authentic imagery that accomodate History’s articles and make them the star of the show.
End Result
We ended up with a really clean looking site! I really wanted to emphasize the use of white space to balance out the large volume of content that readers will be scrolling through. Overall, the look of the site is crisp, balanced, and the design doesn’t distract from the content. Readers can easily find what they are looking for with the strategic use of grids and large image heroes.
