The site is currently in beta. Feedback welcome by tweeting @oscarmakes!

Graphic Design Educators' Network

Web Design • Northumbria University / Textbook Studio • 2016

Graphic Design Educators' Network is a network advocating graphic design education through collaboration. This is supported through developing and sharing of resources such as pedagogy and their events through membership and partnerships.

I was commissioned in 2016 to create their new responsive website and using WordPress as the Content Management System.

Information Architecture

In the wireframes and the site map provided, post types were decided to structure the content on the site.

  • Pages
  • Blog Posts
  • Events
  • Members

Using WordPress, we were able to map these post types perfectly by utilising already existing ones but also creating custom ones for Events and Members.

Desktop and mobile screenshots of the Member Profiles page on the Graphic Design Educators' Network website.

Design

Utilising the wireframes already provided to me, the typography and colours were only needed to completely style the website according to brand.

The website is also built using Sass, a CSS pre-processor which also helped to structure many of the design components that the website needed. These components can be easily added and removed for scalability by following the BEM syntax and ITCSS methodology.

One of the major components required was the tile. The tile is a smaller content type that exists on the page sidebar and heavily on the home page. It was a major component because the design needed to be flexible to hold different content types. This is achieved by providing different layouts and sizes.

Example tiles on the home page

Reflection

In the end, I built a site that I am proud of containing the refined processes and workflow I learnt from building The Oswin Project, 3 years ago.

While working straight from wireframes to development is unorthodox, the information architecture and aspects of design were already planned. When you plan a project, it's planned to succeed and not every process is the same.