This semester I decided to take a course in Information Architecture and learned that its similar to library science. The similarity they wield is that they both structure information in a unique way whether its alphabetical or numeric. Information is organized for users like you and me are able to access it more easier. With that being said. I'll give you a rundown of the course for this semester.
Course: ADV 3560
Website Architect
Prof: Neely
The Objective of this course is to:
- Improve Web Literacy
- Understand the Web Development Process
- Enhance your skills at gathering and evaluation Information
- Seeing information in the abstract and separate content structure from presentation
- Understand the Principles of Databases and how they're created
- Understand how to structure information to support users needs
- Learn how to create content inventories, website diagrams and wireframes.
Optional Text: Information Architecture for the World Wide Web
Class 1 - Introductions / Website Architecture
Notes: We had to introduce ourselves to the class and the professor gave a brief lecture about the course. He mentioned that he will be giving us a quiz on the basic principle of IA next class.
Class 2 - Understanding the Medium
We go into more the blogs in this class.
We build our blogger sites and then have to post 10 blogs that are related to Information Architecture.
We also go into how the Internet itself is larger than the world wide web.
We cover the Tasks that a Web Project Require
1. Define The Project
2. Develop Site Structure
3. Design VIsual Interface
4. Build & Integrate
5. Launch & Beyond
We cover the Tasks that a Web Project Require
1. Define The Project
2. Develop Site Structure
3. Design VIsual Interface
4. Build & Integrate
5. Launch & Beyond
Class 3 - The Web Development Process
Notes: In this class we learn that Information Architecture boils down to a science that involves Library Science and Psychology.
We learn about site diagrams that have boxes lead to site maps and wireframes.
Last but not least is the Information Architecture Diagram: Content, Context and Users.
Class 4 - Understanding Users and User Needs
Notes: The Resource Triangle which is used for most projects.
Quality
Money
Time
Class 5 - Content Analysis / Organizing Information
Notes: Patrice Crooks Business
A young student in our class is about to launch her business. Our goal is to take notes and evaluate her competitors as lab. After we were done discussing about her Business. We were assigned to use google to find her competitors.
The notes I took based on her business
Company name: Made by Totty which is a personal tribute to her grandmother.
Product: Soap that's infused with moisturizers that doesn't leave your skin dry and contains a lot of nutrients. - I've seen this soap in person. It looks like candy. I'll give you a quick visual. Think of holding a hershey's mini in your hand or a reese's cup. Thats how her soap look and it also has the candy scent as well. She advises everyone not to eat the soap. (IT REALLY LOOKS LIKE CANDY)
Target Audience: Women
Competitor: Lush Soap and FamousCookies.com
Other notes based on Patrice.
- For Clients put cart before the horse.
- Do your best to educate them (the client).
- Clients are very frustrating.
- Take notes on your competitors.
- Ad Copyright.
- Branding is very important.
- Purple is her favorite color.
Class 6 - Organizing Information / Documenting Structure
Notes:
In this class we go over Way Finding.
Way Finding on the web is getting from point A to point B very fast. They're more like Design signs
All about finding your way.
*Think about the user needs. The usability and the usability design.
Bad Web Design + Bad Information Design = Pissed Off Users
*Think about the other users
* You need a site of criteria to criticize a website.
Good or bad? Who is the User
The user = Target Audience
There are nothing in good and bad with the abstract
An example of this would be:
The Demographics on Occupy Wall Street
Ages - 18 to 24 some college
Users would be:
Arm Chair Doomsayers - People who want some type of "doom" to happen
News Consumers - (General Online Readers)
Silent Protests - People who "would" protest, but not able to do it.
Voyeurs - People who like to watch
Politicians and Activists
Unemployed
Journalists
Demonstrators
Who?
What?
When?
Why?
Where?
and
How ?
Pertains to this.
Class 7 - Navigation Search
In this class we cover some examples of Navigation being used
There are two types
Exact which would be Chronological, Numerical, Alphabetical and Geographical - You know the information
Chronological - Time
Numerical - Numbers
Alphabetical - A to Z
Geographical - By Country, State or Area
and the second would be Ambigious or Subjective
- Categories / Topics - Food would be broken down into fruits, veggies, etc..
- Task Based - More like a F.A.Q (Frequently Asked Questions)
- Audience - Pertaining to a certain audience (ign.com) would be for gamers
- Metaphor - To mimic an object like in real life, but on the web. For example an interactive zune or ipod website.
Class 8 and 9 - Midterm Review and Midterm
Notes:
N/A
Class 10, 11, 12 - Navigation and Wireframes
Notes:
Content Inventory of Time Warner
1. Our Content
2. Our Company
3. Our Innovations
Content Inventory is the List of the site.
Client Friendly
0. Home
..1. Our Content
1.1 Turner Br. System
1.2 W.B Entertainment
1.3 HBO
1..4 Time Inc.
IT’S ACTUALLY SUPPOSED TO BE
Most Consistent
1. Home
1.1 Our Content
1.1.1 Turner
1.1.2 WB
1.1.3 HBO
1.1.4 Time Inc
What Happens if We Move over to the next Section?
MENU BAR ---à Our Content, Our Company, Our Innovations (1,2,3)
ALSO OVER THE MENU BAR COUNTS TOO à Investor Relations, Newsroom, Careers (4,5,6)
THE FOOTER DEFINITELY COUNTS
THE FOOTER DEFINITELY COUNTS
Legal Privacy, Caution Concerning Forward, Sitemap, Contact Us, SiteMap
Search bar isn’t necessary for the page.
The Footer also counts.
Content on the site that leads you to a different website are not a part of the Content Inventory.
External sites don’t matter. They are not 7…
Social Media are not a part of the Content Inventory
Under the 13 Board of Directors Links in Management is that those links are filler.
The goal is to make it neater. Now the mess of Links you could use the multiple page Links Icon.
This part pertains to Excel Spreadsheets.
Page ID, Page Name, Page URL, Notes
(ex: 1.1) – (blabla) – (blabla.com) – whatever information
Home Our Company Management Board Of Directors Jeffrey L Bewkes
Home - 0
Our Company - 2 (second one in the Global Nav Bar)
Management - 2.2 ( Second one in the local Nav Bar)
Board of Directors - 2.2.1 (Right beneath the Local Nav Bar)
Jeff L. Bewkes - 2.2.1.1 (First of the thirteen links)
Page ID, Page Name, Page URL, Notes
2.2.1.1 , Jeffrey L. Bewkes, blabla.com, See also 2.2.2.1. or something..
Same content. Whatever you notice about the page. You make Reference here.
Wire Framing Pages with JQuery Sliders?
Two Pictures are good way to do it. But there are some miscommunications in between.
Options
1. Notes
2. Breaking this into three pictures? Wow. :\
3. List Active State (Meaning by Trigger by Click or something)
4. Words can solve a lot of problems with pictures.
Example would be:
A wireframe is the layout or skeleton of a website. They represent the content boxes of a web page for example you would have 3 boxes such as your header for your banner, your footer and your content. It serves as a map and compass as you develop the site further.
Examples of Wire Framing
A wireframe is the layout or skeleton of a website. They represent the content boxes of a web page for example you would have 3 boxes such as your header for your banner, your footer and your content. It serves as a map and compass as you develop the site further.
Examples of Wire Framing
Class 13 and 14 - Synthesis and Application of Concepts
Notes:
Develop your blog for the final. Guess what. You're looking at it. :)
Class 15
- Final Exam and Blogs Due
