school of business · typography!is is an example of a header sub title / lead paragraph lorem...
TRANSCRIPT
![Page 1: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/1.jpg)
Website Redesign | Town HallSCHOOL of BUSINESS
![Page 2: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/2.jpg)
Presentation Overview
• New Team Members
• Information Architecture
• Content Creation
• Preliminary Design Elements and Style Tile
• Questions/Comments
![Page 3: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/3.jpg)
New Web Designer/Developer
• Comes from the agency world
• Studied visual arts media at UCSD
• Originally from San Jose, CA
• [email protected] Borillo
![Page 4: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/4.jpg)
New Project Manager
• Project management background
in the healthcare industry
• Originally from South Africa
Rose Pahkim
![Page 5: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/5.jpg)
TimelineNOV DEC JAN FEB MAR APR MAY JUN JUL AUG SEP
Design and Usability
Development
Documentation
Launch
Training
20162015
Strategic Vision
Research and Discovery
z
Information Architecture
FALL
Content Audit and Writing
![Page 6: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/6.jpg)
Terminology
Information Architecture:
Identity:
Style Tile:
Data-driven:
structure of a site; navigation flow and how content is organized
different visual components and features that help define the School of Business and its various departments
a set of design elements that create a cohesive digital presence such as fonts, colors, icons and buttons
qualitative and quantitative data that informs our decisions in Information Architecture, Content Creation, and Design
![Page 7: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/7.jpg)
If you make decisions based on opinion, you will go off the rails.
-AL CAREY CEO of PepsiCo North America May 2016
![Page 8: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/8.jpg)
Audience: Provide What They Need, Where They Need It
![Page 9: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/9.jpg)
How we are structured?
About
Graduate
Centers and Institutes
Faculty and Staff
Undergraduate
Giving
Alumni
Student Services
![Page 10: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/10.jpg)
How we are structured?
About
Graduate
Centers and Institutes
Faculty and Staff
Undergraduate
Giving
Alumni
Student Services
Admissions
Career Services
Veterans and Military
International Student Introductory Program
Student Organizations
![Page 11: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/11.jpg)
Proposed Information Architecture
![Page 12: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/12.jpg)
![Page 13: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/13.jpg)
![Page 14: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/14.jpg)
How do we deliver information?
Goals
• Reduce redundancy
• Reduce quantity of pages
• Use feeds and databases where possible
• “Centralize” where possible
• Be cognizant of web traffic and trends
![Page 15: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/15.jpg)
Content Creation
![Page 16: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/16.jpg)
Content Creation
IA
Keywords and Messaging
Migrate
Content Team Drafts
Edit/ApproveSchool of Business Faculty and Staff
![Page 17: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/17.jpg)
Business Content Schedule
Phase 1
Phase 2
Phase 3
Phase 4
Homepage
Main Landing Pages
About
Undergraduate
Phase 5
Phase 6
Phase 7
Phase 8
Graduate
Faculty and Staff Student Services
Centers and Institutes
Giving Alumni
![Page 18: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/18.jpg)
Elements and Style Tile
![Page 19: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/19.jpg)
Content and Design
Goals
• Think content first
• Start designing using mobile-first method
• Understand how a user interacts with each element
• Style tile
![Page 20: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/20.jpg)
Style and Elements
Round Edges: softer, lighter, more inviting
Slanted Line: modern, cool, engagingAPPLY TODAY
![Page 21: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/21.jpg)
![Page 22: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/22.jpg)
![Page 23: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/23.jpg)
This is an Example of a HeaderSubtitle / Lead Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulpue felis eu porta. Ut eleifend est sed velit malesuada suscipit. Cras ac urna fringilla, aliquet justo porttitor, vulputate lorem. Etiam placerat eros nec neque vehicula dictum et sed mauris. Suspendisse blanmagna quis.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis eu porta. Ut leifend est sed velit malesuada suscipit. Cras ac urna fringilla, aliquet justo port, vulputate lorem. Etiam placerat eros nec neque vehicula dictum et sed mau. Suspendisse bland magna quis. Donec arcu turpid, tempus nec eros sit amet, efficitur tempor mauris. – Anonymous
TITLE Classic Font (confident, professional) Darker color (bold, power) Decreased font size to increase real estate
CONTENT Increased font size for readability Quicker and easier to scan text
TYPOGRAPHY
This is an Example of a HeaderSub Title / Lead Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis eu porta. Ut eleifend est sed velit malesuada suscipit. Cras ac urna fringilla, aliquet justo porttitor, vulputate lorem. Etiam placerat eros nec neque vehicula dictum et sed mauris. Suspendisse blandit, magna quis.
ON DESKTOP Increased title font size Decreased content font size More white space
![Page 24: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/24.jpg)
Familiar, Youthful and Inviting
Bold, Visual Cues
Prominent Calls to Action
QUOTE MODULES
Lorem ipsum dolor sit amet, adipiscing elit. Phasellus pharetra felis eu porta. Ut eleifend est sed velit suscipit. Cras ac urna fringilla, aliquet,vulputate lorem. Etiam placerat erosvehicula dictum et sed mauris.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis eu porta. Ut eleifend est sed velit malesuada suscipit. Cras ac urna fringilla, aliquet justo port, vulputate lorem. Etiam placerat eros nec neque vehicula dictum et sed mauris.
-ANONYMOUS
-ANONYMOUS
![Page 25: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/25.jpg)
TimelineNOV DEC JAN FEB MAR APR MAY JUN JUL AUG SEP
Development
Documentation
Launch
Training
20162015
Strategic Vision
Research and Discovery
z
Information Architecture
FALL
Content Audit and Writing
Design and Usability
![Page 26: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/26.jpg)
Next Steps
• Content, Content and More Content
• Developing Asset Needs
• Wireframes
Redesign Website Presentation Slides and Style Tile
www.sandiego.edu/redesign
![Page 27: SCHOOL of BUSINESS · TYPOGRAPHY!is is an Example of a Header Sub Title / Lead Paragraph Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus pharetra vulputate felis](https://reader033.vdocument.in/reader033/viewer/2022050208/5f5b5a90b6f0a5678a39cb32/html5/thumbnails/27.jpg)
Thank You and Q&A