|
Size: 4135
Comment:
|
← Revision 48 as of 2011-08-27 05:19:17 ⇥
Size: 4920
Comment:
|
| Deletions are marked like this. | Additions are marked like this. |
| Line 1: | Line 1: |
| [[TableOfContents]] | = Gooey: Soft & Sticky = |
| Line 3: | Line 3: |
| = Schedule = == Week 1 == Presentation:: Overview of GUI history Homework:: * Experience and compare two OS desktops * Prepare for a 5-minute presenation of your findings. * Start thinking of a new design of an OS desktop of a target user group. Resources:: * Ubuntu live CD (GNOME desktop): http://www.ubuntu.com * Kbuntu live CD (KDE desktop): http://www.kubuntu.org * Knoppix live CD (KDE desktop): http://www.knoppix.org/ |
<<TableOfContents>> |
| Line 15: | Line 5: |
| == Ongoing == == Completed == * [[/201104]] * [[/201004]] * [[/200809]] * [[/200804]] * [[/200711]] * [[/200705]] * [[/200611]] * [[/200603]] * [[/200601]] |
|
| Line 16: | Line 17: |
| == Week 2 == Activity:: Presentation of os desktop comparison, and discussion Lecture:: GUI structures and components Homework:: * Experience with a GNOME desktop that is specially designed for children * start designing/prototyping a new OS desktop for a target user group of your choice Resources:: * Edubuntu live CD: http://www.edubuntu.org == Week 3 == Lecture:: Web GUI design Homework:: * Find too extreme examples of your favorite web design and a design you hate most. Prepare a presentation that tell the story and the reasons. * Continure your work on designing/prototypeing the new desktop == Week 4 == Activity:: Presentation of your extreme examples of web design Lecture:: GUI design process Homework:: Finish your design/prototype, prepare for the final presentation == Week 5 == Activity:: Final presenations = Assignment Introduction = |
== Assignment Introduction == |
| Line 53: | Line 28: |
| == Target Competency Area(s), Competencies and Level(s) == | === Target Competency Area(s), Competencies and Level(s) === |
| Line 58: | Line 33: |
| == Entrance Level :Level of Prior Competency Development (Optional) == | === Entrance Level :Level of Prior Competency Development (Optional) === |
| Line 62: | Line 37: |
| == Learning Objectives == Understanding the concepts and structures of GUI. Learning the user centred process of GUI design, from analysis, prototyping to evaluation. And having some fun with Windows. |
=== Learning Objectives === Understanding the concepts and structures of GUI. Learning the user centered process of GUI design, from analysis, prototyping to evaluation. |
| Line 65: | Line 40: |
| == Learning Activities == Lectures:: 5 hours, on GUI history, GUI structures and components, GUI design and evaluation. Reading:: 5 hours, back ground material. Group activity:: Design an new GUI for an existing product (evaluation, analysis, design, prototyping and testing): 20 hours Individual activity: Windows face lifting. Compare the modern desktop interfaces (MAC OS X, KDE, GNOME, and of course Windows Explorer). Skin, customise and remaster the Windows desktop for a special target user group. 10 hours. |
Learning some basics of HTML, CSS, PHP and MySQL for making an interactive website. |
| Line 71: | Line 42: |
| == Deliverables == * Report and presentation on the results of the group activity. * Presentations on the findings of desktop comparison. * Presentation and competition on the skinned Windows desktop. |
=== Learning Activities === Lectures:: 2 hours, on GUI history, GUI structures and components, GUI design and evaluation. Presentations and discussions:: 6 hours. Activities:: Students are grouped into teams. Each team * [Task 1, 20 hours] reads a book on GUI design and present 9 "golden tips" from the book to the rest of the class. Each tip should come with 2 examples which are not from the book. * [Task 2, 20 hours] * Theming Wordpress for your showcases |
| Line 76: | Line 50: |
| == List of Available Reference and or Background Materials == From TU library:: * The essential guide to user interface design : an introduction to GUI design : principles and techniques / by Wilbert O. Galitz * GUI bloopers : don'ts and do's for software developers and web designers / by Jeff Johnson * GUI design essentials / by Susan Weinschenk, Pamela Jamar and Sarah C. Yeo |
=== Deliverables === * Presentations from the group activities. * Individual report (no more than 2-page A4 in 10-point typeface) on * what has been learned; * feedback on the assignment: complaints, comments and suggestions |
| Line 82: | Line 56: |
| == From the Web == * http://en.wikipedia.org/wiki/Graphical_user_interface, * http://www.guidebookgallery.org/ GUI screenshots of all kinds of OS. |
=== List of Available Reference and or Background Materials === Books for team work :: {{{#!bibtex abstract=off usekeys=off keywords=off style=alpha @BOOK{Krug-Dontmakethin:06, AUTHOR = {Steve Krug}, TITLE = {Don't make me think}, YEAR = {2006}, PUBLISHER = {New Riders Publishing}, address = {Berkeley, California USA}, edition = {2nd edition}, } @BOOK{Spolsky-Userintedesiprog:01, AUTHOR = {Joel Spolsky}, TITLE = {User interface design for programmers}, YEAR = {2001}, PUBLISHER = {Apress}, address = {Berkeley, California USA}, } @BOOK{Johnson-Bloo:00, AUTHOR = {Jeff Johnson}, TITLE = {{GUI} Bloopers: Don'ts and Do's for Software Developers and Web Designers}, YEAR = {2000}, PUBLISHER = {Morgan Kaufmaan Publishers}, address = {San Francisco, CA}, } @book{Tog92, author = {Bruce Tognazzini}, title = {TOG on Interface}, year = {1992}, isbn = {0201608421}, publisher = {Addison-Wesley Longman Publishing Co., Inc.}, address = {Boston, MA, USA}, } @BOOK{Norman-desieverthin:88, AUTHOR = {Donald A. Norman}, TITLE = {The design of everyday things}, YEAR = {1988}, PUBLISHER = {Basic Books}, } @BOOK{Nielsen-UsabEngi:93, AUTHOR = {Jakob Nielsen}, TITLE = {Usability Engineering}, YEAR = {1993}, PUBLISHER = {Morgan Kaufmaan Publishers}, } @BOOK{Cooper+Reimann-Abouface:03, AUTHOR = {Alan Cooper and Robert Reimann}, TITLE = {About face 2.0: The essentials of interaction desgin}, YEAR = {2003}, PUBLISHER = {Wiley Publishing}, } @BOOK{Constantine+Lockwood-Soft:99, AUTHOR = {Larry L. Constantine and Lucy A. D. Lockwood}, TITLE = {Software for use: A practical guide to the models and methods of usage-centered design}, YEAR = {1999}, PUBLISHER = {{ACM} Press}, address = {New York}, } @BOOK{Tidwell-DesiInte:06, AUTHOR = {Jenifer Tidwell}, TITLE = {Designing Interfaces}, YEAR = {2006}, PUBLISHER = {O'Reilly}, ISBN = {0-596-00803-1}, } }}} Websites:: * http://en.wikipedia.org/wiki/Graphical_user_interface * http://www.guidebookgallery.org/ GUI screenshots of all kinds of OS. * http://52weeksofux.com/ |
Gooey: Soft & Sticky
Contents
Ongoing
Completed
Assignment Introduction
gooey adj : soft and sticky Source: WordNet ® 2.0, © 2003 Princeton University
When a lot of us hear the word "gooey," we think about sticky buns or creamy sugary fillings. Others, especially the software designers and even industrial designers, think "GUI", as in "Graphical User Interface." A GUI is what computer types call the system of icons, taskbars, and other objects that our computers use to display and access information. But nowadays, even smallest portable devices, for example, your mobile phone or my mp3 player, carry a GUI.
Many our designers have a MAC or some unlucky ones are still dreaming of having a MAC, because, as they say, besides many other reasons, a MAC has a “better” GUI than PC’s. Why the “Start” button, even with a “click here to start” slogan, failed to start the designers to open their eyes and wallets? There must be a reason, and we are going to find out why.
Target Competency Area(s), Competencies and Level(s)
- Integrating technology
- User focus
- Form and senses (visual design)
Entrance Level :Level of Prior Competency Development (Optional)
- Anybody who has access to a computer.
- Better if the attendees have some programming experience.
Learning Objectives
Understanding the concepts and structures of GUI. Learning the user centered process of GUI design, from analysis, prototyping to evaluation.
Learning some basics of HTML, CSS, PHP and MySQL for making an interactive website.
Learning Activities
- Lectures
- 2 hours, on GUI history, GUI structures and components, GUI design and evaluation.
- Presentations and discussions
- 6 hours.
- Activities
- Students are grouped into teams. Each team
- [Task 1, 20 hours] reads a book on GUI design and present 9 "golden tips" from the book to the rest of the class. Each tip should come with 2 examples which are not from the book.
- [Task 2, 20 hours]
- Theming Wordpress for your showcases
Deliverables
- Presentations from the group activities.
- Individual report (no more than 2-page A4 in 10-point typeface) on
- what has been learned;
- feedback on the assignment: complaints, comments and suggestions
List of Available Reference and or Background Materials
- Books for team work
- Websites
http://www.guidebookgallery.org/ GUI screenshots of all kinds of OS.