• Like

Loading…

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

Infokon 2010: Jan Brejcha

  • 720 views
Uploaded on

Validace sémiotické analýzy uživatelských rozhraní jako metody pro expertní evaluace

Validace sémiotické analýzy uživatelských rozhraní jako metody pro expertní evaluace

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
720
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
0
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Validace sémiotické analýzy uživatelských rozhraní jako metody pro expertní evaluace Mgr. Jan Brejcha, 15.11.2010 Studia nových médií, ÚISK FF UK pondělí, 15. listopadu 2010
  • 2. Sémiotický základ • Sémiotikou máme na mysli teorii znaků • Znak je “něco, co něco jiného zastupuje” (C.S.Peirce) • Je třeba brát v úvahu 4 znakové roviny: • Pragmatická: zabývá se psychologickými, biologickými a sociologickými důsledky použití znaků • Sémantická: zabývá se významem či znakovou akcí • Syntaktická: zabývá se vztahy mezi znaky (syntax) • Lexikální: zabývá se fyzickými omezeními při tvorbě znaků • Pragmatika: vztahy uživatele – uživatelského rozhraní (UI) a vztahy designéra – UI – uživatele pondělí, 15. listopadu 2010
  • 3. Gramatika interakce: Prvky • Interakční sémiotika je založena na sledu prvků v čase a zaměřuje se na syntax: • Viditelného jazyka: proč a jak je informace prezentována • Interakčního jazyka: proč, jak a kdy je informace prezentována • Prvky interakčního jazyka: • Diskrétní prvky: nejmenší smysluplné jednotky (např. stisk tlačítka myši) • Interakční věty: smysluplné jednotky popisující část interakce se systémem • Interakční rétorické tropy: použití prostředků náhrady (např. metafory), implikované akce (tažení dokumentu na koš pro odstranění, persuaze) • Interakční jazykové tropy/hry: uzavřená jednotka interakce sestávající ze sady interakčních vět • Vyprávění/narace: pořadí vnímání prvků UI, designérovo poselství • Interakční fáze: začátek, prostředek a konec interakce • Vzorce interakce: opakující se struktury prvků interakčního jazyka pondělí, 15. listopadu 2010
  • 4. Gramatika interakce • Určuje pravidla interakčních řetězců: • Co lze zřetězit v příčinné interakční jednotce • Jak to lze zřetězit • Za jakým účelem to můžeme zřetězit • Analýza interakční gramatiky pomáhá vylepšit konzistenci interakce s UI • Upřednostněním konzistence pomáhá budovat očekávání • Omezení posilují interakční gramatiku. Jsou: • Fyzická: affordance • Logická: uvažování • Kulturní: konvence pondělí, 15. listopadu 2010
  • 5. Analýza a anotace UI • Pro analýzu viditelných a interakčních vztahů v sadě UI je třeba extrahovat vnitřní gramatiku, která tvoří jeho “jazyk UI” • Strategie: • Formální textová anotace (např. BNF, TAG) • Viditelná anotace (např. vzorce, zápis pohybu) • Přepis interakce (např. scénař) • Sémiotická analýza využívá strukturovaný přepis interakce, který je založený na interakčních větách • Výsledný přepis sloužil jako vstup pro následnou expertní evaluaci pondělí, 15. listopadu 2010
  • 6. Evaluační metoda: Přehled • Dostupné expertní evaluační metody: • Kognitivní průchod (cognitive walkthrough) • Heuristická evaluace (heuristic evaluation, HE: naše volba) • Expertní inspekce (expert inspection) • Sémiotická analýza (semiotic analysis, SA: naše volba) • Proces evaluace: • Vyhodnotit dvě UI za použití HE a SA • Porovnat výstupní data z každé metody; pro toto porovnání jsme zvolili dvě komplexní aplikace pro grafický design, Adobe Photoshop a GIMP pondělí, 15. listopadu 2010
  • 7. Metoda: Heuristická evaluace 1/2 • “Heuristická evaluace je diskontní metoda použitelnosti pro rychlé, levné a jednoduché vyhodnocení UI” (Nielsen) • Hlavní cíl: • Detailně určit částečná nebo úplná selhání použitelnosti (vč. úspěchů) • Neformální poměřování vůči principům použitelnosti • Určení neformálního stupně závažnosti porušení těchto principů • Výhody: • HE umí zachytit významné chyby, významné úspěchy, doporučit zlepšení a pořadí kroků k nápravě pondělí, 15. listopadu 2010
  • 8. Metoda: Heuristická evaluace 2/2 • 16 použitých kritérií HE (dle AM+A) • Estetická integrita a minimalistický design • Konzistence a standardy • Přímá manipulace / “Koukni a ukaž” (See and point) • Prevence chyb • poskytnutí zpětné vazby a zviditelnění stavu systému • Fittův zákon • Flexibilita a účinnost použití • Nápovědy a dokumentace • Napomáhat uživatelům rozpoznat, určit a zotavit se z chyb • Čitelnost / hustota informací • Shoda mezi systémem a skutečným světem • Vyloučení modální interakce • Vnímaná stabilita • Přednost rozpoznání před vzpomínáním • Plná kontrola a svoboda uživatele • Viditelné rozhraní / WYSIWYG. pondělí, 15. listopadu 2010
  • 9. Metoda: Sémiotická analýza 1/2 • SA se zaměřuje na znaky přítomné v UI a extrahuje kódy v pozadí, které vytvářejí (nebo narušují) jejich význam • Hlavní cíl: • Určit konvence v pozadí • Určit významné diference a opozice • Modelovat systémové kategorie, konotace, distinkce a pravidla pro kombinování jednotlivých prvků (Chandler) • Výhody: • Poskytuje více vhledu, zaznamenává více kompatibilních dat zpři nižších nákladech • Vhodnější pro mezikulturní srovnávání • Srozumitelnější pro účastníky • Existuje množství předchozích dat a příkladů analýzy pondělí, 15. listopadu 2010
  • 10. Metoda: Sémiotická analýza 2/2 • 6 kritérií použitých v SA: • Uživatelé a systém (audience a paradigma) • Symboly • Syntax • Rétorické tropy • Interakční fáze • Vzorce pondělí, 15. listopadu 2010
  • 11. Korpus UI: Výběr pro pilotní studii • Pro výběr pracovní sady UI je třeba vybrat vzorový materiál k analýze: korpus UI • Studie porovnala UI Adobe Photoshopu CS2 a GIMPu 2.6.7 (na Mac OS X 10.5.8) • Korpus má být co nejvíce homogenní (časově i obsahem, Barthes) • Studie se zaměřila na funkce komerčně prezentované, stejně jako základní funkce, které uživatelé pravděpodobně použijí pondělí, 15. listopadu 2010
  • 12. Korpus UI: Analyzované funkce • Výběr 5 funkcí sdílených v obou UI: Popis funkce Název ve Photoshopu Název v GIMPu Soudkovité zkreslení Optická korekce objektivu Klonování perspektivy Klonování objektů v perspektivě Úběžný bod Klonování perspektivy Kustomizace UI Menu přizpůsobení Nastavit klávesové zkratky Odstranění objektu Opravný štětec Nástroj klonování Omezení efektu červených očí Nástroj červených očí na jedno Odstranění červených očí kliknutí • Souběžně s analýzou těchto funkcí: • Přepis krok za krokem souvisejících procesů (interakční věty) • Provedení HE a SA každého UI pondělí, 15. listopadu 2010
  • 13. Korpus UI: Příklad interakčních vět pro Adobe Photoshop, 1/2 • (0) Otevřít obrázek k úpravě • (1) Najít vhodné funkce v menu nebo paletě nástrojů • (a) Jako podúkol, prohledat paletu nástrojů pro tlačítko připomínající zamýšlené akce. (Nic vhodného nebylo nalezeno.) • (b) Alternativně, prohledat položky v menu (zejména to, co se zdálo, že souvisí nejvíce: Obrázek -> Úpravy, Úpravy -> Filtr) pro příslušný příkaz. (Bylo to nalezeno pod Filtr -> Úběžný bod...) • Objeví se okno s názvem "Úběžný bod", které obsahuje živý náhled, dále mj. "Nástroj vytvoření roviny" a "Nástroj klonování”. • (2) Klepnout na čtyři rohy podle informativního textu • Objeví se nápověda: "Kliknutím na čtyřech rozích roviny perspektivy nebo objektu v obrázku vytvořit rovinu pro úpravu. Odtrhněte kolmé roviny z protahovacích bodů stávajících...". pondělí, 15. listopadu 2010
  • 14. Korpus UI: Příklad interakčních vět pro Adobe Photoshop, 2/2 • (3) Vybrat "Nástroj klonování" • (4) Alt-klik v rovině pro nastavení zdroje. • Objeví se nápověda: "Alt + klepněte v rovině pro nastavení zdrojového bodu pro klonování. Jakmile je zdrojový bod nastaven, klepnout na tlačítko + táhněte myší pro malování nebo klonování. Shift + kliknout na prodloužení čáry do bodu posledního kliknutí." • (5) Kliknout + táhnout (pro malování) několikrát pro klonování v perspektivě • (6) Klepnutím na tlačítko "OK" se změny provedou • (7) Uložit změny v souboru pondělí, 15. listopadu 2010
  • 15. Korpus UI: Výsledky HE a SA • Výsledky HE • Kratší, ze 16 heuristik se vždy použilo menší množství • Metodu by bylo možno použít nejen na úrovni interakčních vět, ale i celého UI • Výsledky SA • Výsledky byly popisnější • Všechna kritéria bylo možno použít pokaždé • V některých případech se nálezy opakovaly • Přinesly solidní kontext pro analýzu • Metoda by mohla porovnat UI z různých časových období a ukázat změny paradigmatu, syntaxe a dalších • Metoda ukázala žánry interakce i na tak malém vzorku (úprava obrázků vs. modifikace samotného UI) pondělí, 15. listopadu 2010
  • 16. Budoucí výzkum • Porovnat vzorce interakce uživatelů rozdílných kultur • Vizualizovat interakční vzorce jednotlivých prvků gramatiky • Rozšířit kritéria SA, vytvořit sémiotické heuristiky pondělí, 15. listopadu 2010
  • 17. Bibliografie, 1/2 • Alexander, C., S. Ishikawa, and M. Silverstein (1978, August). A Pattern Language: Towns, Buildings, Construction (Center for Environmental Structure Series). Oxford University Press. • Backus et al. (1963) “Revised report on the algorithm language ALGOL 60”. Communications of the ACM. vol. 6 (1) • Buchler, J. (1955). Philosophical writings of Peirce. Dover. • Brejcha, J., and Marcus, A. (2009). Semiotics of Interaction. Aaron Marcus and Associates, Inc. Berkeley. Whitepaper. • Chandler, D. (2001). Semiotics for Beginners. <http://www.aber.ac.uk/ media/Documents/S4B/>, accessed 20Sep09. • Haan, De, G. (2000). ETAG, a Formal Model of Competence Knowledge for User Interface Design. dspace.ubvu.vu.nl. Dissertation. pondělí, 15. listopadu 2010
  • 18. Bibliografie, 2/2 • Nielsen, J. (2005). “Ten Usability Heuristics”. UseIt.com. <http:// www.useit.com/papers/heuristic/heuristic_list.html>, accessed 24Dec09. • Norman, D. A. (1999). "Affordance, conventions, and design”. Interactions, 38-41. • Marcus, A. (2009). Integrated Information Systems: A Professional Field for Information Designers.” Information Design Journal, 17:1, July 2009, pp. 4-21. Copyright 2009 by Benjamin Publishing, Amsterdam, Netherlands. • Marcus, A. (1997). “AM+Aʼs UI Design Heuristics”. Aaron Marcus and Associates, Inc. Berkeley. • Morris, C. W. (1970). Foundations of the Theory of Signs. The University of Chicago Press. pondělí, 15. listopadu 2010
  • 19. Děkuji jan.brejcha@ff.cuni.cz http://jan.brejcha.name pondělí, 15. listopadu 2010