PPC Bee 3.0

PPC Bee se chystá skočit do nových vod! Do vod nového a přehlednějšího uživatelského rozhraní se zaměřením na lepší navigaci. V následujících řádcích vám popíšeme, co všechno nás k tomuto rozhodnutí vedlo.

Příběh zmateného uživatele

Představte si, že vytváříte svoji první kampaň. Nastavili jste datový zdroj, pečlivě vybrali produkty a chystáte se vytvářet klíčová slova. Proměnná z vašeho datového zdroje ale ne vždy vrací pouze produkt. Chcete ji tím pádem trošku poupravit. Ale kde? Jdete tedy na přehled datových zdrojů, vyberete požadovaný datový zdroj a dáte “Upravit”, ale jediné co uvidíte, je stránka na upravení názvu zdroje a URL. Naštvaní pak proklikáváte nastavení kampaní, nastavení organizace a další, ale bez úspěchu.

Kde se tedy proměnné schovávaly? Mohli jste je najít na stránce datového zdroje, ale místo pod stránkou upravit, jsou pod jeho názvem.

Chyby všude kolem

Navigační problémy, jako ten výše zmíněný, se vyskytovaly všude napříč aplikací PPC Bee. Na některých stránkách se uživatel ztrácel úplně: „Kde jsem? Jak jsem se sem dostal? Jak se dostanu zpátky. Kde je navigace mezi záložkami?”

Pro nováčky v PPC Bee byla hlavní navigace těžce zpozorovatelná. Na menším rozlišení se dokonce schovala pod “hamburger” a její používání bylo velmi obtížné. Někteří uživatelé používali raději wizard jako jejich hlavní navigaci.

V rámci našeho odhodlání vyřešit problém s navigací, jsme udělali několik uživatelských testů a procházeli zpětnou vazbu, kterou se nám postupně podařilo nasbírat.

Postupné úpravy

Prioritizovali jsme velké problémy a jednoduchá řešení. Stejně tak jako problém s datovými zdroji. Nebo hlavičku na stránce Šablon, která s danou stránkou neměla nic společného. Taky přidání přímého linku na úpravu proměnných z kteréhokoliv generátoru pro lepší navigaci napříč aplikací.

Odkaz sloužící pro úpravu proměnné

Tyto drobné úpravy ale nemohly vyřešit všechno. Největší změnou, kterou bychom vám dnes chtěli představit, je nová navigace. Původní zastaralá navigace nabrala až příliš mnoho odkazů na nové funkcionality PPC Bee. Pod vlastní vahou se začala rozpadat, byla předimenzovaná a další nové odkazy už nebylo kam dávat.

Nová navigace

Když jsme začali předělávat hlavní navigaci, věděli jsme, že je důležité, aby měla následující vlastnosti:

  • Výraznější než ta původní.
  • Použitelná na standardních rozlišeních desktopových monitorů.
  • Schopna pojmout všechny stávající navigační prvky a ještě pár navíc.

Do vodorovné navigace se všechny prvky s dobře čitelnou velikostí nevejdou. Širší svislý boční panel (pozn. kodéra: sidebar :)) by to zvládl, ale ukrojili bychom tak spoustu místa ze stránky, které bychom mohli využít lépe. Na některých stránkách by to dokonce byl problém.

Proto jsme se rozhodli pro boční panel s popiskem při najetí kurzorem. Ale najet na každou ikonu zvlášť, abyste věděli co se pod ní skrývá, může být zpočátku nepříjemné. Proto jsme boční panel udělali rozšiřitelný, kdy uvidíte všechny ikony a jejich popisy najednou.

Designování záhlaví

Při redesignování navigace jsme se museli potýkat se spoustou problémů. Někteří uživatelé mohou mít velmi dlouhé názvy organizací či kampaní a nevešly by se tím pádem do bočního panelu. Kdybychom je zkracovali, tak by se sice vešli, ale bylo by to na úkor přehlednosti toho, v které organizaci či kampani se uživatel momentálně nachází.

Zároveň jsme věděli, že pro tento účel chceme přehledný a dostatečně velký prostor. Inspirovali jsme se u mnoha webových aplikací, díky čemuž jsme se nakonec rozhodli pro další panel, tentokrát v horní části obrazovky. Tam je nakonec umístěn název stránky vlevo a na druhé straně věci týkající se přímo aplikace.

Jednoduché záhlaví stránky nadřazené úrovně
Složitější záhlaví zobrazující kontext, úpravu a cestu k nadřazené stránce

Co stojí za nápadem s názvem stránky? Chceme tím uživateli napovědět, kde se momentálně nachází a taky to, jak se může dostat o úroveň výš. A jelikož uživatel s velkou pravděpodobností zkusí upravovat název přímo tam, kde je, přidali jsme možnost editace názvu i do horního panelu.

Pravá sekce je plná věcí, které se dotýkají aplikace celkově. Od výběru organizace, přes novinky, nastavení vašeho účtu až po wizard.

Konzistentní navigace

Dalším cílem redesignu bylo udržet konzistentní navigační schéma napříč aplikací.

Staré navigační schéma bylo částečně zmatečné, hlavně co se týká některých podstránek a jejich hlaviček. Některé stránky na stejné úrovni měly záložky, jiné ne. Někdy zase podstránka ukazovala hlavičku své nadřazené stránky, což znejasňovalo to, na jaké úrovni se vlastně vyskytujete.

Přehled generátou klíčových slov
Specifický generátor klíčových slov se stejnou hlavičkou jako jeho nadřazený

Z nejnižších podstránek, jako jsou generátory klíčových slov a reklamních textů, jsme tedy hlavičky odstranili.

Zároveň jsme se ujistili, že panel se záložkami vždy ukazuje pouze podstránky na stejné úrovni.

Nová hlavička na stránce kampaně

Prázdné stavy

Doposud to vypadalo takto — pokud v seznamu položek nebyla žádná položka, nezobrazila se v PPC Bee prázdná stránka, ale stránka pro vytvoření nové položky.

Odstranění panelu záložek z podřízených stránek znamenalo, že nemůžeme rovnou přeskočit k vytvoření nové položky, ale zobrazí se nám prázdná stránka. A proto jsme přišli s novou grafikou pro prázdné stavy.

Prázdný přehled klíčových slov

Nový wizard

S novou navigací musí zákonitě přijít nový wizard. Lehce jsme ho zmenšili, abychom mohli uživateli nabídnout více místa k práci a opravili jsme dvě důležité chyby:

  • Video tutoriály jsou od teď více výrazné a najít je není problém
  • Wizard od teď udrží to, jakou kampaň jste zpracovávali naposledy

A tady je nový vzhled wizardu:

Chceme feedback!

Moc se těšíme na to, až tuto změnu uvidíte na vlastní oči. Nicméně si uvědomujeme, že s každou velkou změnou přicházejí i problémy. Řekněte nám o nich a společně posuneme PPC Bee k ještě většímu uživatelskému komfortu. Vyzkoušejte nový design a dejte nám prosím vědět dole v komentářích, nebo na emailu info@ppcbee.com, co si o tom myslíte!