INFO 330 What’s IA?
Let’s make it simple A la English • Information: The common forms of knowledge artifacts we find around us • Architecture: The art and science of designing structures. • Information Architecture: The art and science of designing information structures.
Info IA vs. HCI People Tech • Both • Heavy user focus • About design • Similar methods and deliverables • Personas, interviews, usability tests • Wireframes, design specs • IA • Center on the user and information • Came from industry • HCI • Center on the user and the “thing” • Came from academia
IA vs. UX (User Experience) http://uxmag.com/articles/content-strategy-and-ux-a-modern-love-story http://andrearicheson.org/wordpress/?p=160
The Information Architecture Process http://www.sitepoint.com/the-web-design-process-part-2-information-architecture/ http://www.egov.vic.gov.au/victorian-government-resources/website-management-framework-wmf-/government-website-guidelines-victoria/support-resources-information-architecture-process-diagram.html
Just how confused are we? http://www.youtube.com/watch?v=D0EMpuEEGhg
For us, IA is information • Representation • What types of info do we have? • How is each type constructed? • Organization • How are items of the type related • To each other • To the whole base of info • Display • How do we layout the info and it’s org • How do we name (Label) the display • What parts of each type and org belong on each display?
How’s it different than • Software development: Implements the structures that an IA creates • X management systems • Content, asset, record, document, data, knowledge, etc. • Web sites • The Web is what made IA so hot, but it is only the first stop. • Libraries and information science • IA came from library science but has moved on to embrace a world of other stuff.
Back End and Front End IA Behind the screen In front of the screen The user The org that pays The project The team The info The info structure The application code The templates
On the screen The layout The look & feel The info The navigation The labeling The features The display code (css, java)
An Info System Display Storage Authoring System Management system Info Base Display system Templates Info model Mobile Web Info storage Code Whatever else
Moving info between storage and display Transmit Request Click Parse Request Display page Build Page Transmit Page
Building Pages Built page Shop Page Template Cust http://xyz.com/program.php? orderId=234 & custId=123 & page=shop Cust Area Template Order Area Template Order
Part 1 Reverse Engineer Built page Nav Area Content Area Dissected Page Page Template Data base Nav Area Nav Area Content Area Content Area
Part 2 Forward Engineer Presentation Model Info Model Templates Templates Templates Templates View (page) View (page) View (page) View (page) View (page) Data base View (page) Presentation code