Rafal Tomal follows the following web design process:

  1. Do research and sketch ideas.
  2. Create typography style guide.
  3. Create color palette.
  4. Make wireframes of all pages.
  5. Design home page.
  6. Design about page.
  7. Design … page.

Do research and sketch ideas.

  1. Set goals.
  2. Research your target audience.
  3. Create a sitemap
  4. Seek design inspiration.
  5. Turn your first ideas into sketches on paper.

Project Planning Deliverables

  • Project description
    • What are we building?
  • Project goals
    • What do you want to achieve from this thing you are building?
  • Target audience
    • Who are your clients?
    • Create an imagined profiled (persona) of a typical user/client.
  • Deliverables
    • Clarify your deliverables.
    • Deliver well-organized project files to show professionalism, accuracy, and precision.
    • Examples:
      • Typography style guide
      • Color palette
      • Wireframes
      • Design mockups
      • Assets (design materials, photos, etc.)
      • Information (link to web fonts)
  • Project management
    • Define your bigger milestones then divide those into smaller portions until you have a full lists of to-do tasks for each milestone.
    • Sample:
      • Project research
      • Style guide
        • Typography
        • Colors
      • Wireframes
        • Home page
        • Blog page
        • Blog post
        • About page
      • Design mockups
        • Home page
        • Blog page
        • Blog post
        • About page
      • Delivering the final files
  • Sitemap

Goals can be:

  • Get more clients
  • List services
  • Present portfolios
  • Show client reviews/testimonials
  • Build authority through a blog
  • Have a way to contact you
  • Start an email newsletter
  • Preference for a design (e.g., minimalistic)

After design assets are created, they should be passed down to the developer for execution.


Tomal, R. (2015). The Essential Web Design Handbook.