RYATHO | University Website
  • Year 1
    • Introducing Visual Communication >
      • The Comic
      • Technical Skills
      • Drawing & Visualising
      • Colour, Composition & Narrative
      • IT Sessions
      • Workshops
    • Multi-Dimensional Graphic Design >
      • 2D
      • 3D
      • 4D
      • Set Exercise
      • Workshops
    • Other >
      • West Walls Brew Co
  • Year 2
    • The Designer's Toolkit >
      • Alignment & Hierarchy
      • Contrast & Negative Space
      • Balance & Colour
      • Hotfoot
    • Type & Typography >
      • Hierarchy & Layout
      • Magazine Layout Design
      • Responsive Digital Typography
    • Graphic Design Projects >
      • D&AD: Yahoo!
      • Museum Brand Identity
      • Information is Beautiful
      • West Walls Anniversary
    • The Critical Designer >
      • Research Blog
    • Other >
      • Uptown Gallery
  • Year 3
    • Independent Research Paper >
      • Research Blog
  • Ryatho.co.uk
  • Year 1
    • Introducing Visual Communication >
      • The Comic
      • Technical Skills
      • Drawing & Visualising
      • Colour, Composition & Narrative
      • IT Sessions
      • Workshops
    • Multi-Dimensional Graphic Design >
      • 2D
      • 3D
      • 4D
      • Set Exercise
      • Workshops
    • Other >
      • West Walls Brew Co
  • Year 2
    • The Designer's Toolkit >
      • Alignment & Hierarchy
      • Contrast & Negative Space
      • Balance & Colour
      • Hotfoot
    • Type & Typography >
      • Hierarchy & Layout
      • Magazine Layout Design
      • Responsive Digital Typography
    • Graphic Design Projects >
      • D&AD: Yahoo!
      • Museum Brand Identity
      • Information is Beautiful
      • West Walls Anniversary
    • The Critical Designer >
      • Research Blog
    • Other >
      • Uptown Gallery
  • Year 3
    • Independent Research Paper >
      • Research Blog
  • Ryatho.co.uk
 

Responsive digital Typography
​​​
TYPE & TYpography

​Project Brief

Set exercise 3
Following on from the previous brief, design a webpage for the magazine.

Jump to final outcomes

Take me there

Research

Websites
Vox.com (News & Opinion)
Picture
Picture
Picture
Picture
Picture
The Verge (Technology, Science & Entertainment)
Picture
Picture
Picture
Picture
Picture
The Next Web (Technology)
Picture
Picture
Picture
Picture
Picture
Polygon (Gaming)
Picture
Picture
Picture
Picture
Picture
Ars Technica (Technology, Gaming & Science)
Picture
Picture
Picture
Picture
Picture
Wired (Business, Lifestyle & Technology)
Picture
Picture
Picture
Picture
Picture

Thumbnails

Picture

Development

Screen sizes
Picture
So I can use frames in Figma, I've stuck to some preset screens to make the most use of:
iPhone 16 Pro
iPad Portrait - common tablet size across industry
​iPad Landscape - similar in size to common laptop screen sizes 
MacBook Pro 16inch - similar to both large laptops and desktops in density 
Design 1: Development
Picture
Picture
Picture
Picture
Picture
Picture
Picture
Picture
Picture
Picture
Design 2: Development
Picture
Picture
Picture
Picture
Picture
Picture
Picture
Picture
Figma Development Board
 

FINAL OUTCOMES

Design 1
Picture
View Design
Design 2
Picture
View Design
Back to top
Site powered by Weebly. Managed by 34SP.com