Rubrika: Uživatelské rozhraní

Určitě jste už řešili situaci, kdy potřebujete ukázat nějaký obsah na kliknutí. S jQuery už je to dneska hračka, ale proč, zaměstnávat JavaScript, když by mohlo stačit CSS.

Jednoduchý trik popisuje tutoriál od Ryana Collinse.

Keymaster.js je JavaScriptová knihovna pro implementaci klávesových zkratek do vaší aplikace. Nemá žádné závislosti na jQuery, či jiném frameworku a minimalizovaná má 35 KB.

Via @enoice

Luke Wroblewski napsal a Marek Prokop linkoval

Velmi chytrý způsob zadávání obvyklých věcí, které potřebujeme často psát a chytré interakce v užitečných kontextech, které si navíc můžete doinstalovat jako moduly. Palec nahoru. Siri pomůže, ale tohle se určitě hodí.

Via @jakubspanihel

100 poctivých piktogramů v OpenType fontu, nebo EPSu. Zdarma. Chystají služby pro použití jako web font.

Zatím to nepodporuje žádná verze Internet Exploreru, ale pokud vás tenhle detail netrápí, bude užitečné se mrknout na to, jak vám nové pseudo-třídy umožní validovat formuláře.

Tentokrát o vychátávkách, které nejsou na pohled tak moc vidět, o to víc ukazují, do jaké hloubky signálové přemýšlí.

Zdroj The new Basecamp: Interface details and power user goodness

Jistě si vybavíte to chytré dotykové rozhraní. Jistý Evan You ho realizoval čistě v HTML5. Bez iPhonu se ale nechytáte, protože jinde není podpora v prohlížečích na potřebné úrovni.

Mimochodem, Evan tímto způsobem hledá práci. Myslím, že nebude hledat dlouho.

Via Daring Fireball

iPhone share dialogTenhle dialog se objeví, když v Safari na iPhonu kliknete na ikonku pro sdílení (obdelník s šipkou). Je proklatě „zahuštěný”, musím vždy znovu číst ty dlouhé popisky. Zarovnání na střed ničemu nepomáhá. Dovolil bych si tvrdit, že ikony + text zarovnané vlevo by bylo lepší řešení, problém je, že to nemá nikde v iPhonu precedent.

Tohle video jste už nejspíš viděli. Skvělá ukázka nových způsobů navigace a interakce s obsahem.

Myslím, že emailoví klienti — weboví i desktopoví — jsou jedna ze zanedbávaných oblastí a je tu spousta prostoru pro zlepšení.

Via Jiří Sekera

Zdroj Fluent

Generátor různých hlášek v aplikaci, včetně pokročilého nastavení jak a kde budou vyskakovat. Samozřejmě se nedříve snažíme žádné hlášky vůbec nevypisovat a sdělit danou informaci v rámci uživatelského flow, ale když už nebude zbytí… ;-)

Basecamp byla, alespoň v mých očích, taková vlajková loď web aplikací a modelu Software as a Service (SaaS). 37signals před pár dny představili novou generaci Basecampu. Jak už jsem tweetnul, myslím, že to bude vlajková loď nové generace web aplikací.

Ještě méně abstrakce, méně tlačítek, plynulé flow, rychlost, rychlost, rychlost.

— Zdroj Jason Fried, Basecamp Next: UI preview

Za přečtení rozhodně stojí vysvětlení DHH, jak se jim podařilo dosáhnout takové rychlosti odezvy. Spoiler: HTML5 pushState a cacheování až za hrob.

Přídáno 19. 2. 2012: DHH blíže vysvětluje cacheování v Rails.

Myslel jsem, že jsem tohle téma vyčerpal minulým postem, ale ne, @pavel_macek vyštrachal Button Builder od UI Parade.

Stále mi chybí možnost zadat si tam obrázek na pozadí pro nějaký ten noise, ale jinak už je to skoro ono.

Pokud by se vám hodilo zobrazovat nějaké notifikační číslo v ikoně web aplikace v tabu prohlížeče, pak vám zkuste Tinycon. Když prohlížeč nepodporuje dynamické favicony, bude měnit title stránky.