Webová aplikace nabízející pokročilé prototypovací funkce pro správu a řízení design procesu, včetně integrace s dalšími nástroji.
Nástroj najdete na adrese https://www.uxpin.com/.
Souhrn
- Je to placené
- Trial je na 7 dní
- Nabízí možnost prototypování, ale také stavby design systému (o tom teďka v poslední době dost píšou na blogu)
- Je to webová aplikace
- Docela fajn na wireframing/prototyping a dobrý na dokumentaci ohledně všech věcí, které se týkají designu! (to mají docela fajn)
- Jinak je to ale nástroj docela dost podobný axure, jen s trochu hezším obličejem
Co to umí
- Lze si vložit persony a business model
- V podstatě jí jednoduše popsat – quote, demografii, frustrations, goals, atp. (popisování ale není zase tak snadné, jak by se mohlo zdát :)).
- Vložit fotku
- Lze jí sdílet v projektu nebo s dalšíma lidma
- Nabízí to prototyping nástroj
- V projektech se dá pro položky vést status (jako v Invision)
- Prototyp umí klasicky nastavovat velikosti obrazovek (mobile vs desktop)
- + grid a další věci
- umí to přidávat breakpointy a dělat responsivní prototypy … funguje to jako v Axure (prvky lze posouvat, měnit, atp.)
- Je právě blbé, že při změně (třeba barvy) se to nepromítne všude
- Při sdílení jde breakpointy mít volitelné ručně, případně si dát auto nastavení (jako v Axure)
- Lze používat klávesové zkratky, ale liší se to od ostatních nástrojů
- Např. pro obdelník je potřeba mačka B (je to box) místo R (rectangle)
- Lze si vést ke stránkám dokumentaci a popisky jednotlivých prvků (podobně jako v Axure)
- Jsou tam integrované různé knihovny (jsou jako komponenty a lze je editovat)
- Pro ikonky – lze vybírat z mnoha knihoven
- Komponenty
- Foundation nebo Bootstrap
- a další
- Lze přidávat interakce mezi stránkami a vybírat i transitions (ukazuje to jejich náhledy, tedy ten efekt)
- Transitions lze modifikovat, jako duration, easing, atp.
- Lze vytvářet vlastní animace … třeba automatické po načtení stránky, atp.
- Editor animací je trochu přes ruku, ale dá se s tím naučit
- Lze vkládat klasicky různé prvky, boxíky, ovály, atp.
- Nabízí to dostatek nastavení a properties
- Pro některé prvky to umožňuje některé custom CSS vlastnosti (viz https://www.uxpin.com/community/tutorials/custom-styles-using-css3/)
- Nabízí to integrace s nástroji, např.
- Sketch, JIRA (pouze Cloud), Slack, Photoshop
- Lze projekty sdílet ostatním lidem
- Ve sdílení je preview, možnost komentářů a inspect mód
- Na komentáře není potřeba se registrovat
- Inspect mód nabízí možnost vidět CSS property, atp.
- Ve sdílení je preview, možnost komentářů a inspect mód
- Integrace se Sketch
- Nabízí možnost exportů artboardů
- Je možné pracovat přímo s design library
- Objekty jsou poté jako vrstvy stejně jako ve Sketch – nejde je ale editovat, to lze pouze ve Sketch – lze s nima ale v pohodě pracovat
- Velikost artboardů se mi ale nevyexportovala přesně a musel jsem donastavovat
- Dá se docela hezky pracovat s design library -> naimportovat si do ní hromadu věcí a pak přepoužívat ve Skech, ale i přímo v UX Pin
- Lze si udělat design library
- Přidávat do ní barvy, komponenty, obrázky
- S komponentama ale můžu pracovat pouze v rámci UX Pin, nemůžu je přidat ze Sketch a ani používat ty již vytvořené ve Sketch
- Brzy budou i textové styly
- ! je potřeba ale knihovnu syncovat ručně, neděje se to automaticky … to samé stahování, je potřeba ručně
- Super je, že vložené věci jde exportovat v YAML formátu – nejdou ale exportovat vložené komponenty! takže to není zrovna moc design systém
- Přidávat do ní barvy, komponenty, obrázky
- Lze si ukládat různé verze iterací v jednom projektu (což je super), ručně
- Dá se mezi nima přecházet, vracet je, atp. Je to vlastně historizace
- Moc se mi nelíbí, jak je UI pro ovládání takové nekonzistetní disappointed face , nicméně se to docela pohodlě používá