Rozprávění je o neznámém poznání. Ale návrháři nejsou příběhy a cíle, které navrhují, by měly být pro uživatele vždy jasné. Vložením malých spoilerů do našich návrhů uživatelského rozhraní a zkažením překvapení navrhujeme pro mnohem lepší uživatelské zkušenosti.

To často bylo prohlašováno fanoušky pop-moudrosti, že existují pouze dva odlišné pozemky v celé západní kultuře: člověk jede na cestu a cizinec přijde do města.

Krátké procházení vaší knihovny bude vyvrátit pravidlo - pokud nepovolíte metaforické cesty, ve kterých vše zapadne - ale frekvence, se kterou se myšlenka opakuje, a smysl, který se zdá, dělá, mluví o objemech centrální neznáme v západní nápady vyprávění.

Na obou pozemcích se člověk seznámí s něčím novým a nečekaným, jedinou variantou je pohled, z něhož vypráví příběh; v obou případech je příběh oblouk neznámým známým . Když Clint Eastwood jezdí v rozbitém městě v Idahu v roce 1800, naše zvědavost o jeho totožnosti je to, co nás pohání. Když čteme trilogii Tolkienových Pán prstenů , nikdy nemůžeme pochybovat o tom, že Frodo nakonec přijde na Mt Doom, zájem o to, co se děje na cestě.

Klíčem k vyprávění příběhů je, že je neznámé a neznámé se stane známé.

Designéři nejsou příběh-Tellers

Mnoho designérů se odvolalo na sebe jako příběhy, ale je to prostě kýč, jak se odkazovat na komunikaci. Abychom vyprávěli příběh, musíme při přípravě na velké odhalení podporovat neznámé a hlavní překážkou tohoto přístupu je, že webové zkušenosti - a já bych tvrdil, že většina setkání s designem - jsou nelineární a otevřené.

Design je ve skutečnosti daleko bližší k poezii. Poezie typicky existuje v kouscích s velikostí kousnutí a ve kterých tématech se zkoumá, které jsou otevřené interpretaci.

Daleko od vytváření příběhu je návrhářovým úkolem vyjasnit co nejvíce neotřesně.

Použití Spoilers v mikrointerakcích

Jaký je nejvíce zaujatý prvek v Jaws ? Je to Brody hádka se starostou? Je Quint vyprávět příběh o Indianapolisu? Je to záležitost Hoopera s Ellen Brody (ano opravdu, přečtěte si knihu!)? Ne. Je to hudba. Jakmile žralok začne hrát na violoncello, víme, že přichází, jeho příchod je doslova ohlasován. [Mimochodem, Jaws je zajímavým příkladem filmu, ve kterém do města přichází jak cizinec (žralok), tak člověk jede na cestu (k moři).]

Můžeme vytvořit zájem o design tak, že neustále klesáme spoilery, naznačujeme, co přichází, s vlastní hudbou violoncello. K tomu využíváme mikrointerakce - jednoduché komponenty UI, které obsahují spoušť a zpětnou vazbu. Zpáteční část mikrointerakce je místem pro vložení spoileru.

Funguje při náhledu dat, které by v lineární zkušenosti byly zavedeny později. Klíčem je přenášet data vpřed.

Miniatury

Začněme něco známého: klasickým příkladem přenášení informací je náhled. Miniaturní náhled je náhled většího prvku, vizuální průvodce, co očekávat na druhém konci odkazu.

Jacky Winterová je talentová agentura pro umělce, ilustrátory a animátory. S různorodým rozsahem talentů je nejlepším způsobem, jak procházet práci s tradičními miniatury.

jackywinter

Miniatury nemusí být tradiční. Alexandre Nacache je umělecký ředitel a interaktivní designér, jehož stránka používá náhledy prvků projektu spíše než reprodukce miniaturního designu.

nacache

Bao je tchajwanská restaurace s třemi lokalitami v Londýně. Jejich umístění ilustrací působí jako miniatury, což naznačuje nejen pohled na restauraci, ale možná zážitek.

bao

Denní výstup je design studio v Glasgow. Miniatury na svých stránkách tvoří hlavní součást uměleckého směru a vytvářejí vlastní estetickou značku.

adayout

Čtení 5 minut

V den, jediný způsob, jak vědět, jak dlouho bude čtení tohoto článku trvat, je kontrolovat čas, číst článek a zkontrolovat čas znovu.

Na základě svého využívání je jedním z nejúspěšnějších prvků UI posledních let poměrně užitečným ukazatelem, který nám říká, jak dlouho bude článek číst. Populární v místech, jako je Medium, není zapotřebí sledování očí, nebo vypočítaná rychlost čtení, odhad "5 minut čtení" je založen na počtu slov - 125 slov je očekává se čtení za 30 sekund nebo tam. Ale i tato zhruba generalizovaná data stačí k tomu, aby uživatelé mohli přijímat informovaná rozhodnutí o svém závazku k webu, článku nebo produktu.

Monotónně Australské rádio designu je rozdělena pouze kontrastní červenou, používanou pro vznášené stavy. Jediný prvek, který využívá červenou barvu bez interakce? Hrací hlava, která má pozici a celkovou délku.

adr

Sekvoje je společnost s rizikovým kapitálem v Kalifornii. Profily technologických firem zaujímají vstupní stránku. Každý profil obsahuje očíslovanou pozici a animovaný časovač posuvníku upozorňuje na přesně tam, kde se právě nacházíte.

sekvoje

Vimeo obsahuje některé z nejlepších videí na webu. Mohli si zobrazit všechny informace, které chtěly - producent, předmět, titul - když se vznášejí nad náhledy. Vybrali si trvání.

vimeo

Cinelli je nejlepším motocyklem značky Itálie. Jejich produktový posuvník obsahuje očíslovaná tlačítka "Next" a "previous". Šipky samotné by stačily na to, aby vysvětlily význam, ale návrháři přinesli údaje dopředu jednoduchým doplňkem k tlačítkům.

cinelli

Kvalifikační údaje

Jedním z nejjednodušších způsobů, jak rozšířit rozhraní, je kvalifikaci dat se smysluplným kontextem. Klíčem k tomu není doručování příliš velkého množství informací, jen jednoduché shrnutí, které lze na první pohled přečíst.

Pomozte skautovi je zákaznický servis SaaS. Na jejich panelu se zobrazují klíčové metriky, jako jsou celkové rozhovory, což by bylo bez významu, aniž by bylo nutné přidat šipku a procento, které by indikovalo, zda se jedná o zlepšení nebo neúspěch.

pomáhá

Rezervace vstupenek z Lyonu do Bordeaux je zjednodušená Vlaková linka zobrazuje lištu pod časem cesty, aby poskytla vizuální indikaci jak trvání, tak počtu změn.

vlak

Mapy a ujištění

Když předvídáme cesty, zejména cestu do neznáma, často zkušenosti s mapou demystifikujeme. V reálném světě je mapa velmi podobná miniatuře cíle. V návrhu uživatelského rozhraní mapy, které používáme, objasňují architekturu informací.

Štítky jsou jednou z nejkomplexnějších oblastí informační architektury, protože mají tendenci k žargonu, často exkluzivnímu žargonu. Přidáním mikroskopu bez žargonu se zobrazí náhled cílů pro uživatele a pomáhá jim nalézt cestu k správným informacím.

Mřížka je řízení výkonu SaaS, ale jejich produkty jsou velmi zaměřené na firmu. Tento problém řeší signalizací klíčových vlastností každého produktu v jejich nabídce.

mřížka

Thriva pomáhá sledovat vaše zdraví pomocí krevních testů, které můžete provést doma. Mají tři úrovně produktu, které jsou ve svém menu jasně vysvětleny.

thriva

Finanční transakce jsou technicky složité. Přehoz nabízí různé produkty API pro vývojáře. Jejich nabídka nejen vysvětluje klíčové vlastnosti každého produktu, ale také náhledy dvou možných řešení založených na kombinacích produktů.

přehoz

Klíčem k efektivnímu návrhu uživatelského rozhraní jsou spoilery

Vyprávění příběhů je protikladem efektivního návrhu, protože příběhy podle své povahy přitahují neznámé prvky do zkušenosti. Design, naopak, usiluje o odstranění neznámého tím, že objasní.

Když přenášíme údaje v návrhu, obvykle to děláme jednoduše. Jediný kus dobře vybraných dat může objasnit celý proces. Mikrointerakce jsou ideálním způsobem, jak vložit tyto "spoilery", které umožňují uživatelům vytvářet vlastní zkušenosti a zároveň vždy přesně vědět, kde se nacházejí v širším kontextu.

Tím, že odhalíme více než lineární příběh, zapojíme uživatele mnohem efektivněji a navrhujeme zkušenosti, které jsou robustní a zábavné.