Lampiran 1a. Web Usability for Diverse Audience and Culture Avinanta Tarigan Workshop On : Pemberdayaan Web Untuk Meningkatkan Kerjasama Internasional.

Presentasi berjudul: "Lampiran 1a. Web Usability for Diverse Audience and Culture Avinanta Tarigan Workshop On : Pemberdayaan Web Untuk Meningkatkan Kerjasama Internasional."— Transcript presentasi:

1 Lampiran 1a

2 Web Usability for Diverse Audience and Culture Avinanta Tarigan Workshop On : Pemberdayaan Web Untuk Meningkatkan Kerjasama Internasional Menuju World Class University Dec, 11 th- 12 th 2009 GUNADARMA UNIVERSITY

3 Background Web = Branding Web = Marketing Web = Academic Services Web = Distribution of Information Web = Academic Atmosphere in Space of Cyber Internationalization.vs. Localization

4 Hal Penting Konten  Informasi yang relevan dan organisasinya  Frekwensi update dan alert Usability  Kemudahaan navigasi  Kemudahan dalam menemukan informasi yang dicari Penampilan  Familiaritas  Kontras vs Uniform, Highlight & Navigasi

5 Organisasi Informasi Arsitektur organisasi informasi vs Struktur Organisasi Contoh Organisasi Informasi:  Prospective Students, Staffs & Students, Parents, Other  Akademik dan Perkuliahan, Fakultas dan Program Studi, Penelitian dan Kerjasama, Pengabdian Masyarakat  Latest News, Media Coverage, Campuss & Infrastructure, Achievements

6 Pengkinian Informasi Frekwensi Update menentukan posisi pada Layout  Visi Misi.vs. Publikasi.v.s.  University News.vs. Staff Blog Perlunya Information pool center  One stop service untuk mengetahui hal-hal yang terkini dari seluruh domain (News,Blog,Pengumuman, dll)  Moderasi.vs. Tidak Dimoderasi

7 Web Usability Kualitas “user experience” ketika berinteraksi dengan WebSite Web Usability yang baik antara lain :  Mudah untuk dipelajari  Efisien dalam mencari atau menemukan informasi  Navigasi dan Struktur Informasi Mudah diingat  Sedikit kesalahan  Kepuasan subyektif yang tinggi Look and Feel Localization (tidak saya terjemahkan sbg Lokalisasi)

8 Usability Guidelines Simple and natural dialogue Speak the users’ language Minimize the users’ memory load Consistency  Visual look  Command semantics  Conceptual model

9 Usability Guidelines (cont) Feedback Clearly marked exits Shortcuts Good error messages Prevent errors Help and documentation

10 Things To Avoid Slow downloads Can’t find what I want or what I find is outdated Poor graphic design and layout Hard to navigate Gratuitous use of “bells and whistles” Inappropriate tone Designer-centeredness Lack of attention to detail

11 Design Web & Kultur / Budaya Web didisain agar dapat dibaca dan dirasakan lebih familiar oleh orang dari bangsa / kultur tertentu Culture Dimension (Hofstede)  Power Distance: degree of equality, or inequality, between people in the country's society  Collectivism-Individualism: degree the society reinforces individual or collective, achievement and interpersonal relationships  Masculinity-femininity: The traditional masculine work role model of male achievement, control, and power.  Uncertainty Avoidance: level of tolerance for uncertainty and ambiguity within the society - i.e. unstructured situations.

12 Indonesia Menurut Hofstede

13 Culture vs. UI : Power Distance, 1/2 Metaphors  High: Institutions, buildings with clear hierarchy: schools, government, monuments, etc.  Low: Institutions, buildings with equality, options: Summerhill, play/games, public spaces, etc. Mental Models  High: Reference data with no relevancy ranking  Low: Less structured data with relevancy Navigation  High: Restricted access, choices; authentication; passwords  Low: Open access, multiple options, sharable paths

14 Culture vs. UI: Power Distance, 2/2 Interaction  High: Severe error messages: “Entry Forbidden,” “You are wrong;” wizards or guides lead usage  Low: Supportive error messages, cue cards Appearance  High: Images of leaders, nations; official music, anthems; formal speech  Low: Images of people, daily activities; popular music; informal speech

15 Culture vs. UI: Individualism vs. Collectivism, 1/2 Metaphors  Individualist: Action-oriented, tools  Collectivist: Relationship-oriented Mental Models  Individualist: Product- or task-oriented  Collectivist: Role-oriented Navigation  Individualist: Individual paths; popular choices, celebrity choices; stable across roles; customizable  Collectivist: Group-oriented, official choices; changes per role

16 Culture vs. UI: Individualism vs. Collectivism, 2/2 Interaction  Individualist: Keyword searches; active-oriented; multiple devices; customizable;  Collectivist: Limited, official devices; role driven Appearance  Individualist: Images of products, people; low context; hyperbolic, dynamic speech; market-driven topics, imagery, language; customizable; direct, active verbs  Collectivist: Images of groups, organizations; images of roles; high context; official, static terminology; institution-driven topics, imagery, language; passive verbs

17 Power Distance vs. Individualism-Collectivism Individual Individual- ism Index Collective Low Power Distance Index High France Italy South Africa Japan Brazil Mexico Singapore Korea Costa Rica Israel Finland Germany USA

18 Universiti Utara Malaysia

19 Technische Universiteit Eindhoven

20 Culture vs. UI: Uncertainty Avoidance, 1/2 Metaphors  High: Familiar, clear references to daily life; representation  Low: Novel, unusual references; abstraction Mental Models  High: Simple, clear articulation; limited choices; binary logic  Low: Tolerance for ambiguousness, complexity; fuzzy logic Navigation  High: Limited options; simple, limited controls  Low: Multiple options; varying, complex controls

21 Culture vs. UI: Uncertainty Avoidance, 2/2 Interaction  High:Precise, complete, detailed input and feedback of status  Low: General, limited, or ambiguous input and feedback of status Appearance  High: Simple, clear, consistent imagery, terminology, sounds; highly redundant coding  Low: Varied, ambiguous, less consistent imagery, terminology, sounds

22 Sabena: Limited Choices

23 British Airways: Many Choices

24 Culture vs. UI: Masculinity vs. Femininity, 1/2 Metaphors  Masculine: Sports-oriented; competition-oriented; work- oriented  Feminine:Shopping carts; family-oriented Mental Models  Masculine: Work/business structures; high-level, “executive views;” goal-oriented  Feminine: Social structures; detailed views; relationship- oriented Navigation  Masculine: Limited choices, synchronic  Feminine: Multiple choices; multi-tasking, polychronic

25 Culture vs. UI: Masculinity vs. Femininity, 2/2 Interaction  Masculine: Game-oriented; mastery-oriented; individual-oriented  Feminine: Practical, function-oriented; co-operation- oriented; team oriented Appearance  Masculine: “Masculine” colors, shapes, sounds  Feminine: “Feminine” colors, shapes, sounds; acceptance of cuteness

26 Power Distance vs. Masculinity Low Power Distance Index High Masculine Masculinity Index Feminine Japan Italy South Korea Singapore Norway Sweden Finland South Africa Austria USA

27 Excite: For Japanese Men: Cars/Stock Information

28 Japanese Excite for Women: Pale Colors and Recipe

29 Swedish Excite Interface: No Special Website for Women

30 Penutup Organisasi Informasi yang baik dan Usability yang tinggi menuntun user untuk :  Cepat dan tepat mencari informasi  Apa yang kita inginkan agar user mengetahui → tercapai  Puas, ingat, dan ingin kembali Bahasa dan Kultur mempengaruhi bagaimana sebaiknya desain web dibuat Web yang universal seharusnya dapat mengakomodir semua pengaruh kultur dan budaya, tidak hanya bahasa