README is a publication covering the issues, ideas and people shaping the future of cybersecurity.
Its aim is to foster new conversations and become a platform for both provocative and practical viewpoints.
README_
— Thought Leadership Publication
My role: Creative concept and design
Originally, README_ was published on the MEDIUM platform, which users had to subscribe to and had limitations for publishing articles.
GOALS
Ability to publish articles under the appropriate byline
Have dedicated pages for each byline
Have a dedicated section for the Changelog newsletter
Ability to highlight specific articles rather than only having a reverse-chronological feed
Ability to search (by subjects, articles, bylines, etc.)
Toggle between light and dark modes
SOLUTION
The ID (name, colors, fonts, image styling) has already been established. It carried over to the new site.
As for any publication, most of the page space should be dedicated to the content. I decided to have a very thin banner at the top. The name is clearly displayed on the left with a short tagline. On the right-hand side, I’ve placed the Synack logo. A Subscribe button also occupies a prominent position at the top along with the social media share icons.
The top banner is followed by the navigation and search, allowing users to select their area of interest or perform a search.
The featured article takes a significant space to stand out on the page as well as today’s picks for both the article and the newsletter. The owner of the publication gets to decide which article to highlight on the right.
The rest of the articles are listed in chronological order separated by thin purple lines. Each article has an image thumbnail, byline, date, title and a couple of first lines of body copy. I have provided all typography and interactive elements specs.
The publication owner had all the tools in place to run a publication without a dependency on a designer. I’ve come up with a variety of color combinations for featured articles and trained them on how to use the image styling.
README_ landing page
Changelog Newsletter article page
The publication featured the newsletter. Each newsletter had standard sections, which I chose to color code.
README_ article page on dark background
Individual users can toggle between dark and white backgrounds depending on their preference.
Color combinations
I provided a variety of color combinations for the articles’ banners featured on the README_ landing page. The publication owner would choose colors for banners to look exciting and engaging.
README_ article page on white background
Social media banners templates
I’ve designed optional layouts and color combinations to use at templates for promoting README_ articles on social media.