Typographic Layouts: Create Layouts for Content Heavy Websites and Apps

By ·Associate Creative Director at F-i

Free with Membership
or Purchase for $20

Free With Membership

Become a member to get access to this class for only $9.95 a month. Or, purchase individually for the list price.

Learn More

Class Project

Design a new generation custom news reader

This class will teach you how to  make an effective use of typography when creating a layout.

Considering sites like Reuters or the new iteration of New York Times and USA Today we can see how the web is shifting towards typographic compositions where the content is king and the user interface is minimal but relevant. During this  course we will learn how to structure an effective layout for a splash page and a news article template. We will go through the basics of responsive design, grid composition and using typography to build the visual hierarchy of the composition.

What You'll Learn

  • Sketching a Top Level Wireframe. We'll cover the visual backbone of UX, wireframing.
  • Building a Grid. You'll design your perfect grid, detailing how your app looks on different sizes and different devices.
  • Typography, Look and Feel. We'll cover the basic components of typography, including headlines and subtitles.
  • Visual Weights and Composition. We'll prepare elegant compositions using visual weights like size, color, density, value, and white space.

 This is a design only course. No development will be taught! 

 

What You'll Make

You'll design a news reading  app that relies heavily on tasteful typography. During the process of creating a wireframe, you will consider user interaction, asset placement, and responsive design elements. By the end of this class you will have a detailed mock-up displaying all of your app's functions. 

Prerequisites

Must be competent in Photoshop: this isn't a PS tutorial, and while we'll be explaining our favorite PS styles, we'll be moving fairly quickly in regard to tools and layer styles.

Level: Intermediate

Claudio Guglieri

Associate Creative Director at F-i

I am currently an Art Director at the international digital agency B-Reel in NYC. Previously an Art Director at Fantasy Interactive, I was responsible for leading and crafting interactive experiences for clients like Google, EA, CNN, Nickelodeon, History Channel, Range Rover, Microsoft and Motorola to name a few. Alongside my daily job, my personal projects vary from mobile apps and games to card decks and illustrations.

I have spoken at several international conferences including OFFF in Barcelona, the Adobe User Group in Rotterdam or the International Design Symposium at the National Autonomous University of Mexico, and my work has been displayed at design conferences and festivals in London, Barcelona, Athens, Amsterdam, San Francisco, Singapore, Stockholm and New York. 

You can learn more about me here.

View Full Profile

96% Positive Reviews (28 Reviews)

    • At a Glance

    • Membership Class

      Free With Membership

      Become a member to get access to this class for only $9.95 a month. Or, purchase individually for the list price.

      Learn More

    • 8 Video Lessons
    • 947 Students
    • 96% Positive Reviews (28)
    • Self-Paced Online Class
    • How does an online class work?

      Classes revolve around completing a project and collaborating with fellow students to give and get feedback on your work. Use Video Lessons and the Project Guide designed by your teacher to complete your class project.

    • Do teachers give project feedback?

      Teachers design and present all class content, but Skillshare is community based around student-to-student interaction. You'll be surprised at what you learn from your classmates!

    • When does a class end?

      Never! Once enrolled, you have lifetime access to class materials. That means you can learn when and where you want. Learn at your own pace.

    See All
    Free with Membership
    or Purchase for $20

    Free With Membership

    Become a member to get access to this class for only $9.95 a month. Or, purchase individually for the list price.

    Learn More