1. Agenda Turn in Essays Review this weeks chapters Wireframe Logo
PSA Assignment
Site URL

2. Site Map
Use the sticky note method to layout the arrangement of your title page sections. Do this for your site, take a picture and submit.

3. Site Plan
You know the content for your site, and now it is time to let the website designing begin.

4. Required on Site
About
Contact

5. Required on Site
Logo – begins with sketch pages Minimum Navigation Text Images Slideshow Contact Information Social Media Panel – Accordion and/or Tabbed Panels Color Scheme
Listed in Blackboard

6. Now that we know what the content is…
It’s time to wireframe
Let’s start with figuring out how our site is going to look.

7. And learning how to operate MUSE…
Essay

8. Wireframe
A wireframe is created to determine how our site will look. The wireframe should inform on the colors, look of the navigation, structure, mood or feel of your site.
Sketch You are welcome to sketch first and then proceed to use a professional wireframing method such as Inspiration or Mogups.com.

11. Wireframe May create in Photoshop Begin with choosing a size from MUSE
File > New Document in Photoshop of that size
Examples: Wireframe_demo.psd / wireframe-demo2.psd / wireframe_demo3.psd

13. With Photoshop your wireframe may be much simpler
With Photoshop your wireframe may be much simpler. This is the type of wireframe that I would like for you to submit for your site. I would also like one page with a lot more detail as shown in Example A and B

14. Wireframe May also create in Illustrator or InDesign
Begin with choosing a size from MUSE
Create a new document in Illustrator or InDesign of that size
Example: wireframe_demo3.psd

15. Wireframing done more simplistically.

16. Images How do we handle them?
Photoshop > File > Export > Save for Web > Legacy > Presents image in 2-up to 4-up.
Goal: Choose a quality image of a reasonable size.

17. Remember to save all contents in one

18. Identity – Look and feel
What are the functional and emotional benefits of your site.
Keep the goals at the forefront of your mind to make sure they are being communicated.

19. The Purpose of Visual Identity
The basic purpose of visual identity is the same as a branding program—to identify, differentiate, and build a presence and position in the marketplace that is lasting.
A visual identity is the visual and verbal idea of a brand or group
The keystone of any visual identity is a logo, a unique identifying symbol.
Robin Landa

20. Goals of a Visual Identity
Ideally, a visual identity communicates meaning, adds value, is relevant to its target audience, and should be
Recognizable: The shapes and forms are identifiable and decipherable.
Memorable: The shapes, forms, and colors are sufficiently coherent, interesting, and unusual.
Distinctive: The name, shapes, forms, and colors are uniquely characteristic to that entity and differentiate it from the competition.
Robin Landa

21. Goals of a Visual Identity
Sustainable: The name, shapes, forms, and colors would endure, be relevant for a period of years.
Flexible / Extendable: The name, shapes, forms, and colors are flexible to work across media, to grow with the entity’s new services, and to adapt to brand extensions and sub- brands.
Robin Landa

22. Creating Coherence
Intentionally creating a unified brand experience. How? Creating coherence in the look and feel, and clarity.
For visual/verbal coherence, common components across the displaying of your design are:
Strategy – Abbreviations and titles
Logo – Signature
Tagline – Tone of voice
Look and feel – Attitude of imagery/copy
Color or color palette – Descriptive writing
Robin Landa

23. Identity Standards Communicating that consistency
Graphic designers create standards for the use of identity design and logo on all applications to ensure consistency and logo recognition across media.
Consistent use guarantees immediate recognition in a cluttered commercial environment and ensures integrity of meaning.
HUBBARD STREET DANCE CHICAGO: LOGO, LOGO MANUAL, SIGNAGE LISKA + ASSOCIATES, CHICAGO
Robin Landa

24. Identity Standards – More Examples
Hyundai
ttps:// Manual
Pizza Hut
Standards-Manual-Final

25. What is a Logo?
A logo is the single graphic design application that will be a part of your design application.
It does carry a lot of weight and a cornerstone to establishing your identity.
A logo is a unique identifying symbol.
Most often, a logo is part of a broader identity design project.
SAKS FIFTH AVENUE: IDENTITY MICHAEL BIERUT / PENTAGRAM, NEW YORK

26. Brainstorming Results
Let’s begin!
Step 1 – Paper
Step 2 – Pen or pencil
We can use the name of our company.
Create a mindmap > Just start writing down related words > Then allow the words to become images. It is a great way to express a subject in a creative or indirect way. This is what will create visual interest.
After picking out the best design > Take it into Illustrator, Photoshop or InDesign and create it.
Try using some of the methods introduced in the how-to-design-a-logo.pdf

27. Assign: PSA Site Discussion Board: Due March 3, 2016
Post wireframe, jpeg – Work on in class
Contact Sheet of images as, pdf or jpeg
Site URL
Logo thumbs (10 minimum)
Critique 1: March 17, 2016 (at least 4 pages of site and logo)
Critique 2: March 24, 2016 (at least 7 pages of site)
Critique 3: March 29, 2016 (all changes)

28. Set up site 
MUSE:
Launch Muse > Create > Site > Fluid or Liquid Layout (this is new) > Accept the remaining defaults.

29. Set up site 
MUSE:
Fluid or Fixed Width.

30. Set up site 
MUSE:
Accept defaults.

31. Set up site 
MUSE: Site creation
Site created

32. Set up site MUSE: Save Site
File > Save Site > New Folder > Name it (this is your root folder) > Name your site.

33. Set up site MUSE: Publish File > Publish > Name
Can change URL later. By going to File > Manage Business Catalyst Site
This will allow me to check your site progress and the way we will critique them.