Webseiten Design

UX design, UI design, briefing, wireframes, design tools, color theory, color harmonies - psychology - tools, color palette, typography, spacing and sizing, icons and images, headers, hero area, buttons, image galleries, footers, testimonials, tabs, accordions, contact forms, responsive website, mprototyping

Basics

Links

Fotos / Bilder pexels.com pixabay.com elements.envato.com Fonts fonts.google.co...

UI design vs. UX design vs. web design

UX design

UI design

web design

Ein Webdesigner ist für das Design des Frontend der Webseite zuständig.

Learning to work with project briefs

Working with wireframes

Picking the right design tool

Color theory

Color harmonies, psychology and tools

Creating a color palette for our project

Let’s talk about typography

Creating the typography for our project

Spacing and sizing in web design

Using icons and images in web design

Definition and use cases for headers

Let’s design a header

Definition and use cases for hero areas

Let’s design a hero area

Definition and use cases for buttons

Let’s design some buttons

Definition and use cases for image galleries

Let’s design an image gallery

Definition and use cases for footers

Let’s design the footer

Definition and use cases for testimonials

Let’s design some testimonials

Definition and use cases for tabs

Let’s design some tabs

Definition and use cases for accordions

Let's design an accordion

Definition and use cases for contact forms

Let’s design a contact form

What is a responsive website?

Making layout changes for tablets and phones

Making a component responsive

A quick word about prototyping

Next steps and key takeaways