7 ainutlaatuista suunnittelupäätöstä
Olen aina etsimässä inspiraatiota, suurta muotoilua vastaan, joka haastaa konventin. Tämä viesti koskee ainutlaatuisia ulkoasuratkaisuja; Tämä tarkoittaa, että puhun kahdeksasta eri verkkosivustosta, jotka esittävät jotain tyypillistä, ainutlaatuisella tavalla. Menemme yli ainutlaatuiset ulkoasuratkaisut esittelemästä tuotteita ja sisällyttämään henkilökohtaisia ja inhimillisiä elementtejä verkkosivustoon.
1. Harvard palauttaa surullisen karusellin
Harvardin muotoilukoulu verkkosivustolla on ainutlaatuinen lähestymistapa navigointiin. Kun pääset ensimmäiseksi etusivulle, navigointinäkymä on visuaalinen. Tietenkin jokainen linkki ei ole edustettuna tässä, vain muutamia avainasemia. Monet sivustot ovat omaksuneet linkittämisen tärkeimpiin sivuihin etusivun otsikossa; tämä toi meille esimerkiksi karusellit. Mutta en ole vielä nähnyt toisen verkkosivuston esittelyä tällä tavalla. Navigointi voi olla pieni, mutta se on edessä ja keskellä. Vielä tärkeämpää on, että se kuuluu siihen. Se toteutetaan poikkeuksellisesti.
Vasemmalla olevat kuvat ovat päällekkäin, mutta silti näet, kuinka monta on. Kuvasta ja otsikoista on selvä yhteys vasemmalla puolella. Kuvat pyörivät suhteessa vasempaan kohtaan. Joka kerta kuitenkin tiedät, mitä tietoja sinulle on saatavilla. Se on kuin Harvardin School of Design loi parannetun version siitä, mitä karusellin olisi pitänyt olla ensi sijassa. Tämä suunnitteluratkaisu ei ole vain käytettävyys vakavasti, mutta myös ulkoasu on ainutlaatuinen. Molemmat tekijät yhdessä luovat upean visuaalisen suunnittelun.
2. Tra menee pois ruudukosta
Se on melko selvää tra Sivustolla käytetään ei-perinteistä ulkoasua. Sivusto on yleisesti ottaen vähäinen. He käyttävät myös taaksepäin värimallia, jossa tausta on musta ja teksti valkoinen. Värimalli antaa varmasti sen wow-tekijä. Tämä koskee kuitenkin Tra-sivuston ulkoasua. Lähdetään kotisivulta: etusivulla on muutamia kappaleita tekstiä, joista suurin osa peittää taustakuvan ainakin vähän, lukuun ottamatta kappaleen kappaleen "Tiedät ihmiset" -osiosta. Kopio on kohdistettu nimenomaan kuvan ollessa pois päältä. Se on erilainen, se on ainutlaatuinen, se on havaittavissa.
Noin sivulla on hieman enemmän järjestystä ja verkon käyttöä. Mutta verkko on edelleen epäsäännöllinen. Näyttää siltä, että jokaisella sivun osalla on oma verkko. Se, joka kiehtoi minua eniten tästä sivusta, on leikattu kuva sivun vasemmassa yläkulmassa. Se ei sovi mihinkään. Luonnollisesti tämä tekee minut uteliaaksi. Näyttää siltä, että kuva on galleria - sinun on napsautettava sitä, jotta kuvat avautuvat. Se on melko älykäs tapa hyödyntää asettelua; ihmisiä, jotka haluavat tutkia, palkitaan joukolla kuvia. Ihmiset, jotka eivät välitä, eivät menetä yhtä paljon. Se on hauska pääsiäismuna.
3. Voit vierittää kengänkuvia kiinteällä sivulla
Tämä esimerkki ainutlaatuisesta ulkoasuratkaisusta pyörii verkkokaupan jälleenmyyjältä. Feit Tuotesivu on vain loistava. Ensinnäkin malli hyödyntää näytön koko leveyttä ja korkeutta. Tämä tarkoittaa, että kaikki näytön alue on nimetty erityisellä tarkoituksella. Toiseksi, verkkosivusto on yksinkertainen, pieni ja puhdas. Tämä tarkoittaa sitä, että vaikka malli ei käytä koko näytön, se ei ole sotkuinen. Se on erittäin hyvä asia, kun runsaasti muotoilua luottaa tyhjyyteen puhtaan ja vaalean näköisen verkkosivuston luomiseksi.
Asia, joka vaikutti minuun eniten kyseisestä tuotesivusta, on tavan jakautuminen. Sivu on jaettu kolmeen eri osaan. Ensin vasemmalla puolella on navigointi. Se on melko vakio eikä mikään ole erityisen erikoinen. Sitten on oikealla puolella tuotetietoja. Sekä vasemmanpuoleinen navigointi että yksityiskohdat on kiinnitetty näyttöön. Mutta viimeinen osa, keskimmäinen kuva-osio, on täynnä vieritettäviä valokuvia. Mielestäni tämä on loistava ratkaisu, koska se ei ole yleisin ratkaisu.
Usein aikaa, jos on olemassa suuri luettelo tuotekuvista, tiedot siitä pysyvät takana. Tässä vierittämällä vieressäni näen tuotteen kuvauksen ja nimen edelleen, näen edelleen eri värejä, joihin se tulee, ja voi käyttää enemmän tietoja, kuten materiaalin tietoja, koska haluan, ilman vierittymistä ylös ja alas. Kaiken kaikkiaan tämä on saumaton kokemus mahdolliselle asiakkaalle.
4. Näytetään pois useita sivuja tuotteen yhdellä silmäyksellä
Tässä meillä on toinen tuotesivu ja toinen tapa näyttää tuote. Okei, hieno, meillä on myös toinen kenkäesimerkki! Afura Sivustolla on myös ainutlaatuinen näyttömenetelmä. Tällä kertaa kengät näkyvät useissa eri laukauksissa sivun päällä. Se on itse asiassa osa karusellin UI-elementistä. Käytettävyys ei kuitenkaan ole suuri ongelma. Aloittelijoille on oletuksena oletusarvoisesti kolme kuvaa työpöydällä tai kannettavan tietokoneen näytöllä. Kaikissa oletuskuvissa on sama tausta, joka tekee mukavan ja saumattoman näytön. Jos käyttäjä ei ymmärrä, että kuvat ovat osa karusellia, he näkevät ainakin kolme erilaista kuvaa tuotteesta tietokoneissaan. Pienemmät näytön koot, kuten tabletit, oletuksena on näyttää kaksi kuvaa kerrallaan; se on silti melko hyvä. Kaiken kaikkiaan kengätuotteiden näyttö on ainutlaatuinen ratkaisu.
5. Opendoor osoittaa ihmisiltään
Minä, uskon, että verkko on persoonaton paikka, jossa emme yleensä näe ihmistä; todellisia ihmisiä sovellusten, tuotteiden, yritysten ja niin edelleen. Olen aina yrittänyt sisällyttää ihmisen elementin omissa kuvioissani. näen sen Avoin ovi haluaa tehdä täsmälleen saman asian. Kotisivullaan noin puoleenväliin on osio nimeltä "Meillä on selkäsi". Sen on tarkoitus selittää, että opendoor-yrityksen takana on todellisia ihmisiä, jotka ovat siellä auttaakseen asiakkaitaan joka askeleella. Nyt Opendoor olisi voinut juuri jättää sen, mutta sen sijaan he jakoivat suuren kuvan yhdestä työntekijästä.
Tässä osassa on vain vähän tekstiä. Sen sijaan kuva ja kasvot ovat osa suurempaa osaa. Sanoin jopa, että kuva ylittää osan 100% positiivisella tavalla. Jos kuva olisi ollut pienoiskuva tai avatar, vaikutus ei edes olisi olemassa. Jos kuva olisi ollut keskikokoinen neliö (sanoa vähintään 300 x 300 pikseliä) kopion vieressä, vaikutus ei ole sama. Valinta käyttää tällaista suurta kuvaa Markin ystävällisestä kasvosta oli hyvä puhelu; ei vain tämä suunnittelupäätös tarjoa ihmisen ja yksilöllisen muotoilun elementti, se on myös luova. Ilman tätä kuvaa ei olisi henkilökohtaista vaikutusta käyttäjälle. Ilman tätä erityistä ulkoasua, tässä osassa olisi kokonaan erilaiset tunnevaikutukset.
6. UX Flow näyttää pienen animaation voi mennä pitkälle
Seuraava esimerkki ainutlaatuisesta ulkoasuratkaisusta liittyy animaatioon. Jos katsot UX Flow ja vieritä alaspäin hieman huomaat, että yksi lehden taustasta anima. Se on rehellisesti mitään hienoa, mutta se on ainutlaatuinen. Taustat eivät ole helppoutta vierittämällä verkkosivuilla. Jos jotain, viime vuosina olemme nähneet eri elementtejä osastosta, jotka lentävät sisään tai ulos vierittämällä. Mutta minusta tuntuu siltä, että monet taustaanimaatiot parallaksin lisäksi. Syynä tähän on se, että tausta määrittelee osan. Ja vaikka tämä ei ole mikään hullu animaatio, se on silti vaikuttava.
Kaikki ei tarvitse olla rohkeita, ääniä ja ärsyttäviä olla vaikuttavia. Joskus hienoiset asiat, kuten pienet ja nopeat helppokäyttöiset animaatiot, riittävät tuottamaan ainutlaatuisen kokemuksen käyttäjälle. Tämä on varmasti yksi näistä ajoista. Toinen asia, joka on tärkeää huomata, on, että osuudet, joiden välissä animaatio tapahtuu, ei ole ainutlaatuisia ulkoasuja itse. Ei se mitään; Siirtyminen on havaittavissa, kun siirryt yhdestä osasta seuraavaan. Se on silti osa ulkoasua, vaikka se ei olekaan animaation loppusuunnitelma.
7. Ted Toddin integroitu kartta
Visuaalisen suunnittelun ja kokonaisvaltaisen käyttäjän kokemuksen Ted Todd Sivuston verkkosivu on hyvin suunniteltu. Tämän artikkelin vuoksi haluan puhua siitä, miten Ted Todd käyttää sijaintia ja karttaa osassa verkkosivuillaan. Aloitussivun alaosassa on osio, joka on osoitettu eri toimipisteille, joita yhtiöllä on koko Floridassa. On monia syitä, miksi tämä osio on hämmästyttävä. Ensin, osio käyttää ulkoasua ainutlaatuisella tavalla antamaan loistavan suunnitteluratkaisun. Kaikkein näkyvin asia tässä osassa on Floridan valon muoto oikealla. Floridan visio monilla pisteillä on loistava tapa osoittaa yrityksen ulottuvuus. He eivät vain sano, että he ovat Floridassa, malli näyttää juuri sinne. Se on helppo havainnollistaa ja se toteutetaan erinomaisella tavalla.
Seuraava tärkeä asia tässä osiossa ovat pisteet. He ovat todella vuorovaikutteisia. Kun liikutat niiden päälle, saat kaupungin nimen tai kaupungin. Ted Toddin vakuutustoimisto sijaitsee. Mutta napsauttamalla sitä, koko osio siirtyy vasemmalle, jotta tilat olisivat tarkkoja. Saat toimiston puhelinnumeron, osoitteen, avoimet tunnit työntekijöiden luettelon lisäksi. Pidän tästä suunnitteluratkaisusta, koska se sallii käyttäjän siirtyä nopeasti lähialueilleen. Se on visuaalisesti paljon mielenkiintoisempaa ja ainutlaatuisempaa esitystä kuin jos tiedot pinota päällekkäin sivun otsikossa "Florida-toimipisteemme", eikö niin?
