Organisation and navigation

215 views

Published on

First year Digital Media studio. Design and build of a portfolio using HOTGLUE. Basics of structure and navigation design. Introduced with a look at designing within system restraints with real hotglue!

Published in: Design, Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
215
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
2
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Organisation and navigation

  1. 1. Portfolios: Organisation and Navigation Lon Barfield
  2. 2. Organisation and Navigation HOTGLUE (CMS) Organising: gathering stuff together Navigation: Helping the user get around it Sketching and wireframes
  3. 3. Organisation and Navigation HOTGLUE (CMS) Organising: gathering stuff together Navigation: Helping the user get around it Sketching and wireframes
  4. 4. HOT GLUE “making a website with HOTGLUE is just as easy as making a paper collage!”
  5. 5. Flexibility Vs Simplicity “Just one click to create your website” OR Pixel by pixel specification… Both approaches have good and bad points “It’s great, but now I want to do X, and I can’t…” “I want to do X, but I don’t know where to start”
  6. 6. HOTGLUE. Simple - no design! “This structural transparency of HOTGLUE UI permits its users to disregard any separation of Content and Design and /ultimately/ to remove Design as such from the creative practice.” Remember last week: “It would be nice to publish data without layout issues”
  7. 7. The Hot Glue Design Codex In editing mode pages are rendered identically to viewing mode. No menus or other parts of UI shall be visible without user's request. Any newly created HOTGLUE page is always blank. No menu or interface shall interfere with page elements or change their position.
  8. 8. Restrictions... “Because of the structure of HOTGLUE there is no classic undo-functionality.” No Undo???
  9. 9. Being creative within restrictions Think of real world hot-glue (1971 patent)
  10. 10. Not just for gluing Yasuaki Onishi
  11. 11. HOTGLUE has restrictions Find out what you can do Find out what you can’t do Be creative with what you can do
  12. 12. Organisation and Navigation HOTGLUE (CMS) Organising: gathering stuff together Navigation: Helping the user get around it Sketching and wireframes
  13. 13. House design Interconnections between rooms...
  14. 14. Think of the user The user The users tasks The users contexts
  15. 15. Organisation and Navigation HOTGLUE (CMS) Organising: gathering stuff together Navigation: Helping the user get around it Sketching and wireframes
  16. 16. Navigation What will they want to do with the portfolio? How can you help them do it? Tasks and sequences of tasks
  17. 17. Organisation and Navigation HOTGLUE (CMS) Organising: gathering stuff together Navigation: Helping the user get around it Sketching and wireframes
  18. 18. Sketch! Don’t be afraid Use sketches to think Doesn’t matter if only you can understand them Keep them as documentation (“Aha. I’ve done that before!”)
  19. 19. Sketches are prototypes ‘Kitchen’ is fine in house diagrams For digital media we need more detail But, stick to the bare essentials! As with the house diagrams: Sketch, show interconnections and imagine it in use
  20. 20. Organisation and Navigation HOTGLUE Organising Navigation Sketching Creativity within restrictions Users, tasks, contexts Supporting tasks Don’t be afraid

×