Slajdy do wykładu gamedevowego przedstawionego podczas inauguracji działania Studenckiego Koła Naukowego Twórców Gier Komputerowych Shader na AGH w Krakowie
3. Dlaczego UI jest ważny
Interfejs jest elementem który decyduje o
tym jak aplikacja jest doświadczana,
użytkowana i oceniana.
Interfejs wpływa na uczucia i emocje twoich użytkowników.
Może uczynić korzystanie z aplikacji przyjemnością lub koszmarem.
Może przyciągać lub odstraszać użytkowników,
wpływając na sprzedaż i zyski.
10. „A user interface is well-designed
when the program behaves exactly
how the user thought it would”
Joel Spolsky
11. affordances
affordance – visual clue to the function of object
When simple things need pictures, labels
or instructions, the design has failed.
Donald Norman
12. Zelda
the Ocarina of Time
affordances
in games
Braid
13. spójność
dupa
NIEspójność
• systemy miar • częstotliwość prądu w gniazdku
• format czasu • formaty plików
• strony jezdni • dzień początku tygodnia
• języki narodowe • ...
14. spójność zewnętrzna
‘’Users spend most of their
time on other websites”
‘’The good thing about Jakob Nielsen
standards is that there are so
many of them to choose from”
15. Guidelines
Apple Human Interface Guidelines
http://developer.apple.com/mac/library/documentation/UserExperience/Conceptual/AppleHIGuidelines
Windows User Experience Interaction Guidelines
http://msdn.microsoft.com/en-us/library/aa511440.aspx
GNOME Human Interface Guidelines
http://library.gnome.org/devel/hig-book/stable/
23. modes
hard quasi
spring loaded
Modes are a significant source of errors, confusion,
unnecessary restrictions, and complexity in interfaces
Jeff Raskin
26. sztuka vs rzemiosło
„The mind may be the most important graphic design
tool. Aside from technology, graphic design requires
judgment and creativity.
Critical, observational, quantitative and analytic thinking
are required for design layouts and rendering.”
(Wikipedia EN, Graphic design)
28. Co z tego, nie trzeba być grafikiem by tworzyć dobre (NIE: ładne) UI
„Visual design is not just about making your application look pretty.
Good visual design is about communication.
A well-designed application will make it easy for the user to
understand the information that is being presented, and show them
clearly how they can interact with that information.
If you can achieve all that, your application will look good to the user,
even if it doesn't have any fancy graphics or spinning logos! ”
(GNOME Human Interface Guidelines)
29.
30.
31. “Juice” was our wet little term for constant and bountiful user
feedback. A juicy game element will bounce and wiggle and squirt
and make a little noise when you touch it.
A juicy game feels alive and responds to everything you do –
tons of cascading action and response for minimal user input.
It makes the player feel powerful and in control of the world,
and it coaches them through the rules of the game by constantly
letting them know on a per-interaction basis how they are doing.
Kyle Gabler
35. „The keyboard and mouse give you near instant
response and near exact control. The controller is a far
less precise, far more...well...leisurely input device.”
Warren Spector
36. fo n ty czytelność
że czy
)
du
z o
mę
cza
s
UPRASZCZAJ
ze
e pr
stna czy
że
roć to z
p ta
e y
st przecz
tłu to
e w stani
e
ubsteś
Grżeli je
(je
OUTLINES
DUŻE LITERY
duże litery
http://www.gamasutra.com/gdc2004/features/20040326/caminos_01.shtml
40. Feedback
Reduce the user’s experience of latency (1)
• Acknowledge all button clicks by visual or aural feedback within 50
milliseconds.
• Display an hourglass for any action that will take from 1/2 to 2
seconds. Animate the hourglass so they know the system hasn't
died.
• Make the client system beep and give a large visual indication upon
return from lengthy (>10 seconds) processes, so that users know
when to return to using the system.
41. Feedback
Reduce the user’s experience of latency (2)
• Offer engaging text messages to users informed and entertained
while they are waiting for long processes, such as server saves, to be
completed.
• Display a message indicating the potential length of the wait for any
action that will take longer than 2 seconds. Communicate the
actual length through an animated progress indicator.
.
Bruce Tognazzini
http://www.asktog.com/basics/firstPrinciples.html
42. 1. Analiza użytkowników
outline of
2. Analiza zadań
UI/UX design
3. Scenariusze użycia
4. Projekt UI
5. Prototypowanie
6. User testing
7. Uwzględnienie wyników,
poprawki
8. If (masz kasę, czas, jest sens)
goto 5
9. Implementacja właściwego UI
43. prototypowanie
• webowe np. Balsamiq, Pencil, Flairbuilder, OmniGraffle
• Flex/Flash
• Powerpoint, Word, Dreamweaver/HTML itd
47. reading
recommended
Mój referat ;] na końcu jest też spora bibliografia m.in:
Don’t Make Me Think, Steve Krug
User Interface Design For Programmers, Joel Spolsky
Designing Interfaces, Jenifer Tidwel
Design of everyday things, Donald Norman
www.sknshader.pl , www.koshmaar.pl
→
prezentacja i referat do ściągnięcia