Jak jsme redesignovali řádek úkolu

Strojovna
Honza KuldaČlánky autora

Freelo si u uživatelů vybudovalo nálepku jednoduché aplikace na týmové úkoly. Společně s vývojem, kdy neustále vylepšujeme a přidáváme funkce, je čím dál těžší tomuto příslibu dostát. S novým timetrackingem, který jsme přidali před půl rokem, se nám trošku „zaplevelil“ řádek úkolu.

Ukázka původního řádku úkolu.

Proč změna

Změny nemá nikdo rád. A to i když jsou k lepšímu. Jednoduchost je pro nás ve Freelu velice důležitá – stojí a padá na ní vůle nových uživatelů systém (ne)používat. Jenže co je jednodušší, to nutně znamená, že si stávající uživatelé musí zvyknout na něco nového. Najít ten správný balanc není jednoduché a přesto kriticky důležité.

Pro designéra je vždy těžké udělat změnu tak, aby byla přínosná a co možná nejméně ovlivnila návyky stávajících uživatelů.

Tady je seznam všech důvodů, kvůli kterým jsme se rozhodli řádek úkolu předělat:

  1. Nejednotný vzhled funkčních ikon.
  2. Možnost náhodného smazání při záměru editovat úkol přes ikonku tužky.
  3. Příliš mnoho viditelných prvků v oblasti okolo názvu úkolu.
  4. Táhlo na přetahování úkolu je až v pravé části – takže uživatel musí vždy pohledem klouzat zleva doprava a zase zpátky, aby se ujistil, zda přesouvá ten správný úkol.
  5. To samé u trojtečkového menu.
  6. Přeskakování při najetí myši na řádek úkolu s delším názvem.
Ukázka přeskakování při hoveru u delšího názvu úkolu.

Nový řádek úkolu

Co všechno jsme redesignem vyřešili.

  1. Jednotný styl ikonek.
  2. Čistší vzhled u delších seznamů a názvů úkolů.
  3. Mazání (ne tolik používaná akce) jsme přesunuli na pravou stranu řádku.
  4. Trojtečkové menu (více používaný prvek) se přesunul vlevo od checkboxu a názvu úkolu. Zobrazuje se pouze na hover.
  5. Kompletně jsme skryli play tlačítko a objevuje se pouze na hover (na dotykových zařízeních zůstává viditelné bez hoveru).
  6. Eliminovali jsme skákání u delších názvů úkolu.
  7. Ikonka hodin na ruční zadávání výkazu je viditelná na hover a pokud už nějaký výkaz existuje, tak se nezobrazuje vůbec a stejnou funkci vykonává kliknutí na existující výkaz.
  8. Táhlo se nyní zobrazuje na konci názvu úkolu. Je tak pro uživatele jednoduší poznat, co vlastně chce nebo aktuálně přesouvá (hodně používaný prvek).
Řádek úkolu po redesignu.

U mobilního zobrazení stále zůstává vše důležité v přehledném a kompaktním zobrazení:

Seznam úkolů s novým řádkem úkolu v mobilním zobrazení.

Závěrem

Na tuto úpravu jsem si původně vyčlenil 2 dny. Jak jsem ale začal postupně odkrývat, kde všude se řádek objevuje (Moje priority, podúkoly, mobily, tablety, …), už jsem tak optimistický nebyl 🙂

Celá změna trvala přibližně 7 pracovních dní. Pak následovaly 3 týdny testování na vývojové verzi a nasazení na ostrou verzi. Teď nás čeká ještě postupné vyhodnocování změny a ladění drobných chybiček, které se určitě objeví.

Pevně doufám, že změna bude k lepšímu a povede k větší přehlednosti všech uživatelů Freela.

Zajímá mě, co si o změně myslíte a jak vy sami přistupujete k úpravě core funkčních prvků ve vaší aplikaci?

  • Líbilo? Pošli vzkaz v lahvi ostatním

Buď s námi v kontaktu. Posíláme přibližně jednou měsíčně souhrn nových článků. Nemusíš se bát, žádný spam neposíláme a můžeš se kdykoliv odhlásit.

Honza KuldaAhoj, jsem jeden ze zakladatelů Freela. Mým cílem je, aby se ti Freelo dobře používalo a lahodilo tvému oku. Na volné noze skáču od UX přes kód až po webdesign. Sport a dobré jídlo mě provází na každém kroku.

Odcházíš?

A co kdybychom zůstali v kontaktu? Posíláme jen občas souhrn nových článků. Žádný spam. Slibujeme

Na tvou další návštěvu se těší
Karel, Honza a Karel

Mrkni na další články autorů

Udělej si pohodlí a pokračuj ve čtení

Přidejte se k týmům jako Nikon, OEZ, Fotoškoda a komunikujte také lépe nad úkoly.

Vyzkoušet Freelo