it-swarm-eu.dev

Doporučené postupy pro dodávky interaktivních prototypů?

Poprvé představuji prototypy Axure klientovi. Zatímco Axure nabízí velmi podrobné anotace a specifikace, myslím, že je to pro tento projekt nadměrné - plánovací aplikace pro interní použití. Projektový manažer je zvyklý na toky aplikace Visio a aplikace Photoshop, ale je stejně horlivý jako já, abych zvýšil proces návrhu/schválení. Chci zjistit, jaká úroveň detailů se doporučuje v uživatelském rozhraní, anotacích a specifikacích. Moje otázka se netýká pouze Axure, ale je to nástroj, který používám.

Přepracováno: Rád bych znovu zaměřil otázku na výsledky. Jaké výstupy jsou důležité pro klienta, aby viděli, a jak daleko je rozvíjíte? Například specifikace Axure mohou být užitečné pro vývojový tým, ale pro cyklus schvalování návrhu UX/UI si nemyslím, že jsou užitečné.

9
JK Hudson

Důvodem, proč děláme prototypy, je zprostředkovat myšlenky/koncepty/řešení, která nelze zprostředkovat prostřednictvím zobrazování statických obrazovek.

Vždy používám pravidlo, že kdykoli chcete dát pocit nebo pochopení toku vaší aplikace/webové služby, měli byste dělat prototypy.

Právě s prototypy můžete simulovat, jak by se mohlo něco cítit.

Například, pokud chcete ukázat funkci vyhledávání, která funguje jako Google a váš klient pravděpodobně neví, co máte na mysli pouze odkazem. Pak vytvořte prototyp, který vám to ukáže.

Věřím, že tok jakékoli aplikace je jedním z slepých míst normálního UX. Hodně z toho, co dělá aplikaci, je to, co se děje mezi klepnutími.

8
ThomPete

U prototypů bych řekl, že se musíte dostat na úroveň detailů, kde jste schopni vysvětlit a ilustrovat funkčnost způsobem, který je snadno pochopitelný.

Nicméně , je také velký význam , že nikdo nevěří, že váš prototyp bude dokončen ( nebo téměř hotový) produkt. V takovém případě riskujete, že si váš zákazník myslí, že zítra můžete dodat ... nebo se ocitnete v diskusi o drobných (kosmetických) detailech - v prototypu, který nemusí nutně vypadat přesně jako finální produkt, to je!


Obecně platí, že nedokončený/nepotažený prototyp nebo model vyzve uživatele k zadání, kritice a alternativním řešením. Uživatelé mohou vidět potenciální transformace stávající praxe (Ehn & Kyng 1991, s. 652). Rovněž bude těžko zaměňovat finální produkt (Ibid .; Beyer a Holtzblatt 1998, s. 372-3). (To je přesně důvod, proč miluji Balsamiq Mockups .)

Na druhé straně funkční prototyp umožňuje uživatelům získat praktické zkušenosti v konkrétních situacích použití (Bødker & Grønbæk 1991, s. 198).

V prototypu není pochyb o pokusu o úplnost; jeho funkcí je osvětlit specifické aspekty informačního systému. Zvláštní důraz bude kladen na ty aspekty, u kterých existuje nejistota. ... Prototypy se používají k ověření přesnosti předpokladů o těchto aspektech. Na rozdíl od výrobních systémů jsou prototypy obvykle neúplné a neměly by fungovat bezchybně. (Vonk 1990, s. 20-1)


Reference

Beyer, H. & K. Holtzblatt (1998). Kontextový design: Definování systémů zaměřených na zákazníka . San Francisco, CA: Morgan Kaufmann Publishers

Bødker, S. & K. Grønbæk (1991). „Design in Action: Od prototypování demonstrací ke kooperativnímu prototypování“, v Kyng, M. & J. Greenbaum (Eds.), Design at Work (str. 197-218) . New Jersey: Lawrence Erlbaum Associates

Ehn, P. & M. Kyng (1991). „Kartonové počítače: zesměšňování nebo praktická budoucnost“, v Wardrip-Fruin, N. & N. Montfort (Eds.), The New Media Reader ( str. 651-62). Cambridge, MA: The MIT Press)

Vonk, R. (1990). Prototypování: Efektivní využití technologie CASE (str. 20-33). Englewood Cliffs, NJ: Prentice Hall Inc.

12
jensgram

Povaha vašich výstupů upřímně závisí na rozsahu projektu, práci, kterou děláte, a na jakém klientovi se zabýváte. Největší výzvou, které musíte čelit, je rčení toho, co klient očekává a poté jim to poskytnout (nebo upravit jejich očekávání, pokud je to nutné).

Například můj kolega nedávno vytvořil interaktivní prototyp pro klienta v energetickém sektoru v HTML, CSS a Javascript. UI, které potřebovalo vysmívat se (byl to redesign), bylo tak komplikované, že nejlepší cestou, jak o tom mluvit s klientem, byla velmi vysoká věrnost. Protože klienta vzal za ruku a vedl je procesem iterace na prototypu, klient se také mohl dozvědět mnoho o tom, co jejich současné uživatelské rozhraní dělá špatně, proč byla naše vylepšení nezbytná a hodnotná, a dalo jim to dobrý přehled o množství práce spojené s obnovením takto vytvořeného uživatelského rozhraní. Úkolem bylo pouze dodat interaktivní prototyp - na základě této práce by klient vyhodnotil své další kroky. (Stačí říci, že jsme nyní dostali smlouvu na přepracování a implementaci celé další verze aplikace.)

Klíčové možnosti tohoto procesu:

  • Srovnejte věrnost vašeho prototypu s očekáváním klienta. Dobrá správa projektů se týká řízení očekávání a to se u prototypového projektu neliší. Takže zjistěte, co váš klient potřebuje vidět, a pak porovnejte typ prototypu s tím, aby co nejlépe komunikoval vaši práci. V interaktivním prototypování interpretuji „vysokou věrnost“ tak, že znamená překračovat jen šedo-bílé obrazovky a vlastně modelovat barvy, typografii, velikost atd. Co nejblíže finální aplikaci. Jediné, co jsme ve výše uvedeném procesu vynechali, bylo použití stylu domu (např. Všechno se změnilo v hrozný odstín zelené ;-))

  • Buďte co nejtransparentnější ohledně procesu návrh. Jak již uvedlo několik dalších, jedním rizikem během procesu prototypování je to, že si klient začne nějak myslet, že prototyp je stejný jako konečný produkt. Ve výše uvedeném příkladu se můj kolega nezaměřil na udržovatelnost kódové základny nebo takového - jen to naboural společně pro konkrétní případ použití, pro který navrhoval. Ale protože s klientem dobře komunikoval svůj návrhový proces, vysvětlil každý krok na cestě, co se dělo, a zdůraznil skutečnost, že nic z toho nebylo konečné, klient byl schopen pochopit, co se jim dostává. Je to důležitý úskalí, kterému je třeba se vyhnout, ale dobré řízení očekávání může udělat docela dobrou práci.

  • Dokument, co děláte a proč. Interaktivní prototyp nestačí. Musíte je prezentovat způsobem, který bude klient schopen pochopit - nejen vlastníka produktu, se kterým přímo spolupracujete, ale všechny zúčastněné strany do řetězce, který se nebude podílet na procesu navrhování. Můj kolega vytvořil miniaturní web představující aspekty obrazovek, na kterých pracoval, a napsal jednoduchý kód, který vyzdvihl různé části toho, jak věci fungovaly. Tato metadata byla neocenitelná při zajišťování toho, že jakmile je dodávka prototypu předána v rámci organizace po dokončení, dráty se nezkřížily ani nezměnily.

Nejlepší praktiky pro interaktivní výstupy prototypů? Upřímně řečeno, je to všechno o dobrá komunikace a řízení očekávání. Musíte přijít na to, co klient očekává, že uvidí. Jakmile to uděláte, těžká část je za vámi - nyní můžete jít ven a udělat svou projekční práci!


PS. Ne zapojit náš produkt, ale můj kolega to během tohoto procesu použil a objevilo se mnoho výhod tohoto nástroje. Například skutečnost, že všechny naše prototypy jsou okamžitě rozebíratelné online, udělala hračku, aby se klient průběžně informoval o pokroku, a dokonce jsme ho mohli procházet telefonem. To bylo velké zlepšení oproti starým situacím, kdy klienti buď museli být v našich kancelářích, nebo neviděli, co se děje.

6
Rahul

Vyzkoušel jsem Axure a několik dalších nástrojů k výrobě prototypů a dospěl jsem k závěru, že prototypy jsou naprostou ztrátou času se strašnou návratností investic. Vrátil jsem se k mnohem úspěšnější metodě, pomocí aplikace PowerPoint jsem vytvořil storybaords.

Pomocí předlohy snímků vložím do své aplikace prázdnou vanilku .. kůži jako tapetu. Pak mám na ovládacím prvku uloženo několik ovládacích prvků, jako jsou pole se seznamem a podobně. Nakonec mám obrázek kurzoru, který animuji, abych ukázal, kam by uživatel klikl.

Vry rychle, velmi snadno, každý má schopnost otevřít a upravit. A co je nejlepší, komunikuje vizi designu velmi jasně.

Doufám, že to pomůže.

2
Glen Lipka

Odpověď může také záviset na tom, jaký typ prototypu jste se snažili dodat. Pokud by to bylo jen pro jednu (statickou) webovou stránku, bylo by vám ponecháno mnoho možností, např. designové nástroje, jako je Photoshop nebo Illustrator, a dokonce i ručně tažené náčrtky. Pro úplnější/složitější příběh, který může zahrnovat webové stránky s více stavy, uživatelské toky nebo přizpůsobené uživatelské rozhraní, obvykle používám kombinaci Balsamiq , PowerPoint a Word.

  1. Balsamiq k vytvoření maket.
  2. PowerPoint kompilovat makety a/nebo screenshoty; a přidejte popisky pro přidání potřebných podrobností. To je velmi užitečné esp. při ilustraci toku.
  3. Word (nebo jakýkoli textový procesor) pro zdokumentování důkladnějších rozhodnutí o pozadí a návrhu. Z mé zkušenosti s prací s několika skvělými lidmi a designéry se mi zdá, že je to dobrý zvyk rozvíjet se, protože si často nedokážeme vzpomenout na to, o čem jsme se rozhodli velmi podrobně.

Vím, že otázka se týkala spíše nalezení účinných nástrojů, ale, IMHO, nic nepřekoná šanci, když můžete osobně hovořit o svých návrhových rozhodnutích (nebo také pomocí virtuálních prostředků).

2
moey

"Jaké výstupy jsou důležité pro klienta, aby viděl a jak daleko je rozvíjíte?"

Důležitý je výstup, který plně komunikuje interakci a záměr UI. Rozvíjíte to, pokud to potřebujete. Specifika této odpovědi jsou zcela závislá na projektu a klientovi.

Kromě toho se tomu snaží Agilní vývoj pomoci. Myšlenka je taková, že získáte „dotykové“ dodání klientům rychleji, takže k nevyhnutelnému vylepšení dojde dříve než později.

2
DA01

K rychlému prototypování bych použil Balsamiq www.balsamiq.com nebo Mockingbird gomockingbird.com. Pokud jste povinni poskytnout podrobnější plán interakce, jděte na Axure.

Měl jsem docela dobré výsledky kombinací uměleckých návrhů (ve Photoshopu) a Axure, abych vytvořil velmi realistické demo, prodal jsem nápady na design pro (starší) zúčastněné strany, které nemají schopnost/touhu interpretovat drátové modely.

0
Rob Varney

Jak již uvedli ostatní, záleží na tom, co je předmětem přezkumu. Pokud se podobá Balsamiqovým vzorům pro snížení struktury a interakce. Balsamiqovy snímky dobře odvádějí, co je maketa (navrhovaná struktura) a není (návrhová složka), a zaměřme se na strukturu nad grafickým designem. Teprve po dokončení této části přejdu k vizuálnímu designu, a pokud je struktura již dohodnuta, můžete pro schválení návrhu použít ploché soubory. To, čemu se opravdu chcete vyhnout, je dostat se do diskuse o správném odstínu zelené, který se má použít, když jste se dosud nerozhodli, jak by aplikace měla fungovat.

0
ThatSteveGuy

Shrnutí:

Doporučené postupy pro interaktivní prototypy

  • Zobrazit tok mezi obrazovkami
  • Ujistěte se, že uživatelské rozhraní není nastaveno, aby bylo možné očekávat, že aplikace není dokončena, a vyzvat zpětnou vazbu.
  • Použijte agilní metodiku a poskytněte klientovi několik iterací k vyřešení návrhových problémů před zahájením kódování
  • Vyplňte uživatelské rozhraní a anotace pouze na úroveň úplnosti, kterou klient potřebuje, aby porozuměl interakci; Úroveň úplnosti se bude lišit v závislosti na klientovi

To jsou moje hlavní cesty s sebou. Kdokoli s čímkoli jiného přidat?

0
JK Hudson