Introducing 

Prezi AI.

Your new presentation assistant.

Refine, enhance, and tailor your content, source relevant images, and edit visuals quicker than ever before.

Loading…
Transcript

Brick by brick

You only need to solve one problem at a time

Wireframe or comp

How does the Internet work?

An image of a layout that's created before we begin to prototype the design in HTML

Balance

bilateral symmetry: composition is balanced on an axis

Usability v. aesthetic

- Usability handout on Google doc: https://docs.google.com/document/d/1OCm0v18uCR7xN_AgSKWpmi_pH3r7Ds0u-Ko4wO6bxzg/edit?usp=sharing

Web page anatomy

Usability = functionality

vs.

Aesthetic = presentation

Asymmetrical balance

Balance

Continuance

Repetition

Proximity

Balance

Emphasis and focal point

Radial symmetry: objects are symmetrical around a center point

Horizontal / vertical symmetry: draw a line through the center from top to bottom and sides form the same outline

Placing objects close together within a layout creates a focal point toward

which the eye will gravitate

when our eyes start moving in one direction, they tend to continue along that path until a more dominant feature comes along.

What draws the viewers eye?

of colors, shapes, textures or similar objects helps tie design together so that it feels like a cohesive unit

Isolation

Contrast

Proportion

Color psychology

Juxtaposition of dissimilar graphical elements used to create emphasis

Create emphasis through use of size or scale

promotes emphasis

Field devoted to analyzing emotional effects produced by colors

Where will you put the navigation menu?

We are using Bootstrap for responsive design.

Let's start by visiting a whole bunch of websites.

Use the USABILITY handout to assess functionality.

Observe layout and design elements that you do or don't like.

Website critique assignment

Let's begin the wireframe...

Blue (cool)

calming, faith, openness

Red (warm)

stimulates adrenalin

kuler.adobe.com

White

- clean, modern, futuristic

Green

- growth, fresh, hope

Hex value

Yellow

- makes the eyes vibrate

- hardest color for the eye to look at

- babies cry more, etc. p. 40

Learn more about creating dynamic, engaging presentations with Prezi