Moderan

Visuaalne identiteet

Koostöö Frankfurdis tegutseva start-up’i meeskonnaga algas visuaalse identiteedi ja müügiveebi loomisega. Toode on positsioneeritud kui lihtne, kiire ja mõistliku hinnaga, kuid tänu nutikusele ja läbimõeldusele professionaalne. Seda erinevalt konkureerivatest traditsioonilistest toodetest, mis on küll professionaalsed, ent keerukad, kohmakad ja ülikallid.

Seega tuli Moderani identiteedis ühendada ühelt poolt ärikinnisvara valdkonna soliidne tagasihoidlik stiil ja teiselt poolt Moderani meeskonna ja loodava rakenduse põhimõtted, nagu innovatiivsus, nutikus, lihtsus, inimesekesksus. Et stiil oleks küll professionaalne, aga ikkagi konkurentidest eristuv oma särtsakuse ja nutika lihtsusega.

Logo märgis on ühendatud M-täht (nagu Moderan) ja tornmajade perspektiiv. Kirjaosa on asjaliku muljega plokk-kirjas.

Värvivalik lähtub kinnisvara valdkonnale klassikalisest tumesinisest, mida on nihutatud trendikama lilla tooni poole. Põhiaktsendiks pisut särtsakam roheline. Värvipaleti loomisel arvestasime, et kuna tegemist on töövahendiga, siis ei tohi värvid olla liiga erksad ega väsitavad.

Toetava graafilise elemendina kasutatakse Moderani lakoonilisest vormikeelest lähtuvaid piktogramme, mis haakuvad hästi rakenduse kerge ja nutika loomusega. Piktogramme saab koondada süsteemiks ja luua neist mustreid.

Müügiveeb

Et tootearendus oli üsna algfaasis ja põhieesmärk oli toote põhilised müügiargumendid kiiresti veebi üles saada, siis tegime lihtsa ja selge sisuga ühelehelise veebi. Lõime sisu, mis Moderani stiili kohaselt räägib lihtsalt ja selgelt asjadest, mida potentsiaalsel ostjal on vaja teada. Edaspidi saab vajadusel luua ka laiapõhjalisema veebi koos põhjaliku kasutajatoega. Sellise kiire arenduse eelis on ka see, et kui on vaja tootearenduses kurssi muuta, siis saab seda lihtsalt teha, kuna pole veel suuri ressursse nö “betooni valatud”.

Peamine CTA, mis on päises alati näha, on rakenduse demo proovimine – kuna demo on üsna lihtne, siis seob toote uurimine kasutajat toote/brändiga sügavamalt.

Kasutajakogemuse rikastamiseks muidu lihtsas ja lakoonilises veebis kasutame animatsiooni, mis visualiseerib toote olemust. Tänapäeval on juba võimalik luua köitvaid veebianimatsioone, mis laadivad kiirelt ja töötavad ka telefonides, nii et kasutajakogemus on väga hea.

Veebirakendus

Moderani rakendusest oli juba olemas tehniline prototüüp. Meie ülesanne oli rakendusse modelleerida kasutajakogemus, mis vastaks toote positsioonile ja loodud identiteedile. Märksõnadeks lihtsus, nutikus, professionaalsus.

Tegime andmemahuka kasutajaliidese võimalikult selgeks ja lihtsasti kasutatavaks. Menüüriba liigutasime küljelt päisesse. Selle all on laiust võimalikult hästi ära kasutav sisuosa, mille täidab enamasti mõni tabel. Sisuosas on ka tabelites olevate andmete töötlemiseks vajalikud nupud. Avavaates saab hea ülevaate viimastest ja pakilisematest tegevustest ja tähtaegadest ning vaadata kinnisvaraobjekte kaardil.

Visuaalse disaini osas tegime pisikesed ikoonid menüüsse. Lisaks kasutatakse sisuosas veel paljusid erinevaid Font Awesome’i valmisikoone, mida praeguses arendusfaasis pole otstarbekas spetsiaalselt kujundada.

Moderan on veebirakenduse kasutajaliidese ehitanud Kendo UI peale, mis on Javascripti kasutajakomponentide teek (ehk library või kogum), st justkui valmis klotsidest saab oma toodet ehitada. Kendo osutus siiski liialt jäigaks ja ettemääratuks, kui oli vaja komponente endid kohendada, mitte ainult nende väljanägemist. Seepärast tuli teha palju keerulist tööd JavaScriptiga. Viimistletud kasutajaliidese ehitamiseks sobib kiireks prototüüpimiseks sobiva Kendo asemel paremini mõni paindlikum madalamale kooditasemele suunatud raamistik, näiteks Tailwind.

Rakenduses kasutatakse kasutaja seadme operatsiooni-süsteemi fonte. Et fondid on kasutaja arvutis või telefonis juba olemas, siis ei pea suhteliselt suuri veebifondi faile veebist alla laadima. Seega on rakendus kiirem ja mugavam kasutada.

Kokkuvõte

• Arendasime moodsa ja vajaliku digitoote koostöös kliendi eemalasuva meeskonnaga.
• Tegime kasutajaliidese disaini ja arenduse.
• Lõime visuaalse identiteedi B2B digitoote jaoks.
• Tegime veebilehe, mis müüb veebirakendust.