Back

Design Lesson – Home Page research

Updated on 21 Apr 2023#Lesson

In preparation for the redesign of the new Website we will look carefully at other, analyze them and try to understand why the company went into this direction and what it means for us.

Go through the web and gather screenshots of outstanding homepages that are inspiring, well designed or tell a compelling story. Put them into this a Figma Project. I recommend to use gofullpage.com to take the screenshots. We should have at least 30 examples especially from real-estate, SaaS, Big Brands, but most importantly a wide variety of styles. Annotate the section you think are strong or weak, what we should consider when we do our page.

Goals

  • Learn the most crucial elements in Figma: Navigate, Copy, Paste, Frame, files, projects
  • Questions about Website:
    • What is a good website?
    • What visual styles exists for Website?
    • How are animated/moving elements displayed in the screenshots?
  • Get a baseline of what we as a company are we comparing use against? Are we a tech or a real estate company?

Theory

Grid-System are a fundamental concept of Webdesign. Yes, some website do not follow it, but if the website is good then they still know Grid-Systems. Webflow (a tool we will use later) has a nice Youtube-Video to get started. From there on Youtube or Google will show you more.

—> Here's a good article on how to plan a web design from webflow. (More in-depth)