Yksi näyttö jaettu kahteen.

Elokuvateollisuudelle on jo pitkään tunnustettu split screen -tekniikka, jonka varhaiset esimerkit ovat peräisin 1900-luvun alkupuolella oleville hiljaisille elokuville, ja se on yhä suosittu elokuvan ja tv: n nykyään.

001

Jaettu näyttö on käytössä, kun koko näytön elementit on jaettu kahteen tai useampaan pystysuuntaiseen osaan. Näytelmä elokuvasta "Scott Pilgrim vs. maailma"

Tämä on kuitenkin suhteellisen uusi tekniikka web-suunnitteluteollisuudelle. Jaetut näytöt saivat suosittua vuoden 2016 puolivälissä, ja nyt meillä on yhä useampia verkkosivustoja, jotka käyttävät tätä mallisuunnittelua. Muutamia syitä tähän mallikuvioon on niin suosittu:

  • Se on hieno esteettinen laatu. Kun se suoritetaan oikein, se voi tarjota käyttäjille upean katselukokemuksen.
  • Se on hyvä valinta reagoiville kehyksille. Split-screen-muotoilu voidaan sovittaa useille näytöille, jopa pienille. Pienempiin näyttöihin, kuten mobiililaitteisiin, paneelit voidaan pinota.
  • Se auttaa ohjaamaan navigointiasi. Yksinkertaisten suunnittelutekniikoiden avulla voit kiinnittää käyttäjän huomion tiettyyn osaan näytöllä tai kannustaa heitä napsauttamaan sitä.

Kun jakoikkuna toimii parhaiten

Split-näyttö on erityisen hyvä, kun sinulla on kaksi mainostavaa asiaa. Esimerkiksi, kun sivustossa on kaksi täysin vastakkaista muunnosta. Tämä lähestymistapa antaa suunnittelijoille mahdollisuuden kiinnittää huomiota molempiin asioihin ja antaa käyttäjälle mahdollisuuden nopeasti valita niiden välillä.

002

Yksi näyttö, kaksi viestiä Dropbox-oppaissa

Kun sinun kannattaa välttää jaettu näyttö

Split-näytön mallit eivät laajene hyvin, koska sisältö kasvaa, joten niitä ei suositella soveltamaan sisältöä raskaita layouteja. On tärkeää pitää näytöt yksinkertaisina, koska monimutkaiset jaetut näytöt tekevät käyttöliittymästä ylikuormitettuja tietoja. Siksi jaetun näytön ulkoasu olisi täydellinen sovi minimalistisen verkkosivuston suunnitteluun.

Miten päättää, onko jakoikkuna hyvä sinulle

Jos harkitset jakamissivustotekniikkaa sivustollesi, suosittelen sinua kysymään itsellesi muutamia kysymyksiä:

  • Onko se sopiva sisältösi?
  • Onko layoutissa riittävästi negatiivista tilaa?
  • Käyttävätkö käyttäjät arvostamaan ulkoasua vai sekoittavatko ne?
  • Olisiko hyvä jakaa käyttäjien huomion puoliin?

Tärkeintä pitää mielessä, että sisältö on kuningas ja jaettu näyttö olisi yksinkertainen tapa toimittaa viestisi ihmisille.

Suunnittelutekniikat Split-näytöille

1. Pair Vibrant Color ja dramaattinen typografia

Levy- ja materiaalisuunnittelun ansiosta eloisat värit ja dramaattinen typografia ovat suuria trendejä nyt. Värävät värit ovat visuaalisesti stimuloivia ja dramaattinen typografia parantaa tekstisisältöä. Yhdistä nämä kaksi ja luo visuaalisesti mielenkiintoinen malli. Baesman on tehnyt tämän mestarillisesti. He antoivat molempia elementtejä yhtä tärkeitä, samalla kun he voivat valita nopeasti.

003

Kirkkaat värit ja mielenkiintoiset typografiset parit voivat lisätä kiinnostusta

2. Piirrä käyttäjän huomiota CTA-painikkeeseen

Paljon yksinkertaista graafista suuntausta, jakaminen näytölle kahteen erilliseen osaan antaa alkuperäisen tavan ohjata käyttäjää sivustosi kautta. Se on loistava vaihtoehto, kun haluat luoda suuremman yhteyspisteen toiminnollisille puheluille. Alla olevassa esimerkissä voit nähdä, miten negatiivinen tila luo pystysuoran hajautuksen, jotta saisi samanlaisen painotuksen kahteen eri vaihtoehtoon.

004

Vertikaalinen jakautuminen mahdollistaa kahden eri CTA: n painottamisen suosimatta kumpaakaan

3. Luo visuaalinen virtaus "Näytöt"

Kun jaettu näyttö edustaa yhtä kohdetta, on tärkeää muodostaa yhteys sisällösäiliöiden välillä. Yksi mahdollinen tapa on käyttää väriä. Yksinkertaisesti kopioi erillinen väri kahden näytön välisen visuaalisen virran luomiseksi. Tämä toimii erityisen hyvin brändin värin tai värisävyn kanssa paljon kontrastia. Värien käyttäminen on mahdollista kommunikoida vahvempi yhteys kahden sisällön välillä.

Toinen mahdollinen tapa luoda vahva yhteys on kerroksen yksi elementti, kuten teksti kopioida eri näytöissä:

005

Päällekkäinen teksti yhdistää kaksi näyttöä

Viimeisenä mutta ei vähäisimpänä voit käyttää värillistä peittoa tähän tarkoitukseen:

006

Tarkastele näytön vasenta osaa

4. Käytä animaatiota kannustamaan käyttäjiä toimimaan

Hieno animaatio ja interaktiiviset vaikutukset kannustavat käyttäjiä napsauttamaan. Katso mallin " Chekhov on Alive "Alla olevaan sivustoon. Suunnittelu pyytää sinua valitsemaan hahmosi.

007

johtopäätös

Vierailijalle kestää noin kolme sekuntia, jotta sivustosi päätös voidaan tehdä. Tämän vuoksi sinun asettasi on aina oltava kävijämääriä, jos haluat vähentää poistumisprosentteja. Split-screen tekniikka voi auttaa sinua sen kanssa. Split-näytön mallit ovat hauska, toimiva ja reagoiva tapa luoda kiehtova muotoilu.