Navrhování webové stránky pro webové aplikace: Příklady, tipy a aplikace Peeves
Web je zcela přeplněn aplikacemi, které vám pomohou propojit se sociální sítí, vytvořit seznamy potravin, spravovat velké projekty, rozhodnout, kdo udělá čaj a každý další šílený úkol, jaký si dokážete představit.
Jak můžete v celé této soutěži přesvědčit návštěvníky, že vaše aplikace je mezi seno příslovečná? Dnes se podíváme na některé skutečné příklady, abychom zjistili, zda se můžeme naučit, které strategie napodobovat a kterým se vyhnout.
Domovská stránka aplikace je nesmírně důležitá
Strávili jste spoustu času, peněz a úsilí vytvořením webové aplikace. Je to prvotřídní podnik, o kterém si budete jisti, že ho chytne jako požár. Je tu jen jeden úlovek, musíte lidi přesvědčit, aby to zkusili.
Bez ohledu na to, jak dobrá je vaše webová aplikace, stále musíte mít solidní prodejní taktiku, která nakonec přesvědčí lidi, aby klikli na tlačítko „registrace“. I když je služba zcela bezplatná a nabízí spoustu funkcí, opravdu musíte pracovat, abyste tyto konverze vyhráli.
Nikdy nepředpokládejte, že právě proto, že uživatel přistál na vaší domovské stránce, že se skutečně zajímají o to, co musíte nabídnout, a proto potřebují jen nepatrné štípnutí, aby šli dále. Kurz je, že následovali nějaký odkaz pouze s nejasnou představou o tom, kde by skončili, a jsou v delikátní fázi, ve které se pravděpodobně během několika sekund přesune na jiné místo, pokud je nestáhnete.
Domovská stránka vaší webové aplikace je jedním z vašich nejcennějších marketingových nástrojů. Odolejte nutkání rychle vařit něco společně a namísto toho vyvinout své nejlepší úsilí. Podívejme se na několik příkladů, abychom zjistili, co se můžeme naučit.
Tip: Zachovejte Design Simple a Message Strong silný
Náš první příklad pochází z nové služby zvané Kroud. Pojďme se podívat na část webu nad záhybem.
Na této stránce se mi hodně líbí. Za prvé, je to velmi jednoduché a soustředěné. Nepřekoná vás to prázdnými tvrzeními o tom, jak služba změní váš život, ani to neudrží kolem keříku o tom, co je na webu. Není nic horšího než stránka, která se nedefinuje dobře. Pokud nemůžu říct, co vaše aplikace dělá do pěti sekund, jdu dál.
Kroud opravdu přiblíží úkol spojit komplexní službu do jasné zprávy, která také slouží jako silná výzva k akci: „Vytvořte interaktivní stránku s častými dotazy během několika sekund.“ Tento řádek je jednou z prvních věcí, které vidím, když načítám stránku, a okamžitě přesně ukazuje, co web dělá.
Velké tlačítko
Další věc, kterou se z Kroud můžeme dozvědět, je, že velká, tučné knoflíky pro přihlášení jsou dobrá věc! Tady je tlačítko Kroud ve skutečné velikosti.
Toto tlačítko je obrovské a velmi jasné, co se stane, když stisknete: „Start a Kroud“, se sekundární zprávou „Je to zdarma!“. Všimněte si, jak toto tlačítko upoutá vaši pozornost nejen velikostí, ale také barvou. Je to mnohem jasnější než ostatní obsah, takže vaše oči jsou okamžitě přitahovány k tomu.
Tip: Screenshoty musí být!
Domovská stránka webové aplikace má dva hlavní cíle: vzdělávat lidi o vašem produktu a přesvědčit je, aby to vyzkoušeli. To jsou stejné cíle, jaké vidíte v marketingu a reklamě od téměř každé společnosti na této planetě.
Představte si reklamu na časopis nebo web pro novou Corvette. Jak si myslíte, že by tato stránka vypadala? Existuje milion možných návrhů, ale jedna věc by pravděpodobně zůstala konstantní: viděli byste auto. Korvety mají odkaz dobrého designu a vědí, že nejlepší způsob, jak předvést svůj nejnovější výkon, je ukázat vám jeho fotografii v celé své kráse. Kdo by mohl být přesvědčen o koupi sportovního automobilu, aniž by ho viděl? To by bylo ještě více, kdyby sportovní vůz nebyl Corvette, ale místo toho něco, o čem nikdo nikdy neslyšel.
Funguje to jako metafora pro domovskou stránku webové aplikace. Webové aplikace jsou desetník a nikdo o vás nikdy neslyšel. Pokud se nebudete stydět za své špatné designérské dovednosti, lidé budou chtít přesně vidět, jak bude služba vypadat, než se zaregistrují.
Lidé ve Freckle to dobře znají a rozhodli se na vrchol své stránky řadou pěti snímků obrazovky.
Přestože jsou pokryty velké části některých, obraz jako celek vám skutečně poskytne slušný pohled na to, jak služba vypadá.
Funkce jako Screenshots
Aktuální trend v designu domovské stránky webové aplikace je předvádět funkce na vaší domovské stránce s malými ikonami. To je skvělý nápad, který skutečně zvyšuje estetickou hodnotu stránky a pomáhá rozbít velké bloky kopie. Zde je příklad z fakturace společnosti Ballpark.
I když jsou ikony lepší než text, v případě, že skutečně máte solidní rozhraní, si myslím, že snímky obrazovky mohou být mnohem silnějším vizuálním prvkem. Screenshoty přímo komunikují vaši službu, zatímco obecné ikony představují pouze abstraktní představu o tom, co uživatelé mohou očekávat. Podívejte se, jak Freckle diskutuje o svých funkcích.
Podívejte se, jak jsou zprávy posíleny obrázkem přesně toho, jak to bude vypadat v aplikaci? To je trend, který v poslední době vidím stále více a myslím, že je to dobrý trend, který skutečně vylepšuje myšlenku ikon předchozí generace webových aplikací.
Jako další příklad ukazuje TodayPulse tři ze svých primárních funkcí ve vodorovném pruhu snímků obrazovky:
Peeve: Žádné snímky obrazovky
Můžete si myslet, že snímky obrazovky jsou docela základní a že nikdo toto připomenutí nepotřebuje, ale pravdou je, že existuje nespočet domovských stránek webové aplikace, které vám nedávají sebemenší náznak toho, jak aplikace skutečně vypadá.
I když jsou tyto stránky docela atraktivní, jako je Wordfaire níže, šance, že to zkusím, jsou mnohem méně jednoduše proto, že nevidím náhled.
Staré přísloví „obrázek stojí za tisíc slov“ se v této aréně skutečně projevuje. Jednoduše neexistuje způsob, jak si přečíst sedm odstavců textu na domovské stránce Wordfaire. Obchodoval bych alespoň pět z nich pro screenshot bez druhé myšlenky.
Tip: Nechte uživatele hrát se živým příkladem
Koncept „vyzkoušejte si, než si koupíte“ existuje od úsvitu prodavače. Je to jednoduchý koncept, který bude přetrvávat, dokud budou existovat produkty. Závazky sají, zejména pokud existuje nejistota. Pokud necháte uživatele vyzkoušet webovou aplikaci jako první, nejistota bude odstraněna.
Je nesmírně důležité mít na paměti, že „vyzkoušet před zakoupením“ se vztahuje i na bezplatné služby! Zdá se to matoucí, ale je to celkem jednoduché. Dokonce i bezplatná služba zabírá můj čas, zdroj, který mi připadá celkem cenný a nebudu obchodovat jen za nic. Registrace na bezplatnou webovou službu se stále cítí jako závazek; ten, který nechci vyrábět, pokud si nebudu opravdu jist, že se mi tento produkt bude líbit.
Koncept je jednoduchý, vytvořte způsob, kterým mohou uživatelé strkat pneumatiky a kopat pneumatiky vaší aplikace, aniž by museli zadávat jediný kousek informací. Vidíme to v akci níže pro Pen.io. Toto je další stránka bez screenshotů, ale díky odkazu na příklad je o něco lepší, abyste viděli, co získáte ze služby.
Opět je skvělé, že Pen.io to zahrnuje, ale provedení je silnější zpět na Kroud, kde je odkaz na stránku zkoušky posílen ukázkou.
Peeve: Zdlouhavé prohlídky
Některé webové aplikace vás provedou desetiminutovou exkurzí, která podrobně vysvětluje jejich služby. Nechápejte mě špatně, informace jsou dobré a pokud platím za službu, budu chtít. Ale mělo by být „produktové turné“ opravdu tak náročné na práci?
Pokud kliknu na odkaz s názvem „Udělejte si prohlídku“, opravdu chci udělat aplikaci. Živý příklad, jako jsme právě diskutovali v mnohem silnějších než 2 000 slovech vysvětlujících, jaké to bude, když konečně dosáhnete bodu, ve kterém vám to dovolíte vyzkoušet. Některé weby dokonce vytvářejí upravený „chytrý“ živý příklad, který vás provede celým procesem. To je skvělý způsob, jak uživatelům umožnit vyzkoušet vaše služby a zároveň zajistit, aby dostali smysl a zjistili, co od nich chcete.
Opět platí, že není nutně špatné chvástat se o vašich funkcích, ale nezapomeňte, že je důležité umožnit uživatelům pouze skočit a vidět, co si myslí.
Zahrnout video
Dalším nápadem, jak předvést svou webovou aplikaci v akci, je zahrnout krátké video přímo na domovskou stránku. Pokud má obrázek hodnotu tisíc slov, pak je jedna minuta rychlostí 15–30 snímků za sekundu k nezaplacení! Video dosahuje stejného cíle jako příklad a snímky obrazovky, pouze je dynamičtější než snímky obrazovky a strukturovanější zážitek než zkušební plocha s volným tvarem.
Voliér to odvede dobře, když předvádí časový odstup svého editoru obrázků a vytváří tak komplexní manipulaci s fotografiemi.
Jednou z mých současných oblíbených implementací videa z domovské stránky webové aplikace je Greplin. Při načítání stránky se zde objeví video, ale pokud jej po několika sekundách nespustíte, promění se v prezentaci snímků obrazovky.
Peeve: Karikatury, které nikdy nezobrazují aplikaci
Z nějakého důvodu je skvělou věcí, kterou právě teď je, hodit jedno z těchto videí jako zábavnou malou karikaturu. To je často skvělý nápad, ale problém, který mám, je, že po dvou minutách nějaké nudné malé animace stále nemám ponětí, až vůbec netuším, jaká je aplikace vlastně!
Dobrým příkladem jsou dvě níže uvedená videa od Mínus a Summify. Je pravda, že se nakonec dostanou téměř k tomu, aby vám ukázaly ilustrovanou verzi aplikace, ale teprve na samém konci a dokonce i poté je to malý, abstraktní pohled.
Závěrečné myšlenky: Recept na úspěch
Všechny rady v tomto článku jsou zaměřeny na dva primární cíle pro domovskou stránku vaší webové aplikace, o nichž jsme již diskutovali: vzdělávání a lákání. Nejprve odstraňte veškerý nepořádek z vašeho návrhu a omezte jej na nejdůležitější prvky, aby se návštěvník mohl bez důležitých informací soustředit na důležité informace.
Ve svých zprávách uveďte výrazné prohlášení o tom, co aplikace dělá a pro koho je určena. Dnes jsme o tomto posledním bodu příliš nediskutovali, ale existuje silný argument, který naznačuje, že vyhrajete více konverzí jasnou identifikací cílové skupiny. Příklad: „MyCoolWebApp pomáhá návrhářům a vývojářům uspořádat informace o klientech a projektech“ je lepší než „MyCoolWebApp organizuje informace o klientech a projektech“. Nezapomeňte také zdůraznit důležité funkce a důvody, proč by tuto aplikaci měli návštěvníci používat.
Jakmile se vaše zprávy dostanou na druhou, je na čase soustředit se na prezentaci vašeho produktu publiku. Tři skvělé způsoby, jak toho dosáhnout, jsou screenshoty (několik, pokud se můžete houpat), živé ukázkové účty a video zájezdy (druh, který skutečně zobrazuje produkt). Jejím cílem je snížit míru nejistoty obklopující váš produkt. Čím menší je nejistota, tím méně uživatelů se bude váhat zaregistrovat.
To samozřejmě předpokládá, že máte kvalitní produkt. Pokud je vaše rozhraní chromé, pak ho všemi prostředky skryjte před veřejností a místo toho se držte nudných a zdlouhavých popisů!
