Experiență web experimentală
Frontier Atlas
Trei subiecte. Trei feluri de a le explora.
Trei studii interactive despre internet, o secundă și istoria de 4,54 miliarde de ani a Pământului. Fiecare folosește o idee vizuală diferită, dar toate pornesc din același loc.
- Tip
- Colecție de studii făcută din inițiativă proprie
- Domenii
- Direcție · interacțiune · design editorial · dezvoltare creativă
- Tehnologie
- React · Three.js · GLSL · Web Audio
F01 / Întrebarea de pornire
Interacțiunea trebuie să explice ideea.
Partea grea nu a fost să facem trei începuturi spectaculoase. Fiecare interacțiune trebuia să explice subiectul, iar cele trei proiecte trebuiau să pară o singură colecție. Experiența avea nevoie și de o versiune utilă pentru telefoane și dispozitive mai puțin puternice.
Ideea colecției
„Interacțiunea trebuia să explice subiectul, nu doar să fie pusă peste el.”
- 01 / MediuPlatforma ca mediu viu
- 02 / MomentDurata ca spațiu
- 03 / PlanetăMateria ca arhivă
Trei idei diferite, o singură colecție clară.
Studiile nu trebuiau să arate la fel. Aveau nevoie de aceeași structură: un început clar, o interacțiune legată de subiect și o concluzie explicată. Atlasul le oferă un singur punct de intrare și păstrează fiecare proiect diferit.
F03 / Platforma ca mediu viu
The Web, Alive
Particulele răspund vizitatorului în patru capitole despre CSS, procesarea grafică, litere și controlul uman. În loc să citească despre internet ca sistem, vizitatorul îl poate împinge, deranja și urmări cum răspunde.
- Subiect
- Internetul ca material viu
- Acțiunea vizitatorului
- Împinge și schimbă câmpul
- Structură
- Patru capitole legate
F04 / Durata ca spațiu
One Human Second
O secundă este de obicei prea scurtă pentru a fi observată. Acest studiu o încetinește și compară ce fac în același timp corpul, planeta, rețelele și atmosfera. Globul le păstrează într-un singur moment, nu într-o serie de imagini.
- Subiect
- Ce se întâmplă în aceeași secundă
- Acțiunea vizitatorului
- Explorează o singură linie a timpului
- Interval
- Corp · planetă · rețele · atmosferă
F05 / Materia ca arhivă
Deep Time
Istoria Pământului este greu de înțeles ca listă de date. O singură coloană continuă îl duce pe vizitator de la prezent până la formarea planetei fără să-și piardă poziția. Scara păstrează schimbările mari ușor de citit în 4,54 miliarde de ani.
- Subiect
- Toată istoria Pământului
- Acțiunea vizitatorului
- Derulează o singură coloană
- Interval
- De la prezent până acum 4,54 miliarde de ani
F06 / Interacțiune
Fiecare interacțiune explică subiectul.
Studiile arată diferit, dar funcționează la fel: vizitatorul schimbă un model activ, modelul răspunde, iar sursele rămân aproape. Interacțiunea devine parte din explicație, nu decor.
Control
Vizitatorul schimbă modelul.
Derularea, cursorul și atingerea schimbă aceeași stare. Interacțiunea rămâne continuă și nu pare o serie de efecte separate.Sunet
Sunetul susține ce se întâmplă.
Sunetul este opțional și răspunde la mișcarea de pe ecran. Adaugă context, dar vizitatorul păstrează controlul.Citire
Sursele rămân aproape.
Etichetele și referințele rămân ușor de citit lângă partea vizuală. Vizitatorul poate verifica ideile, nu trebuie doar să creadă imaginea.01 / Câmp viu02 / Secundă planetară03 / Arhivă fizicăF07 / Cum funcționează
Efectele sunt adăugate peste o pagină ușor de citit.
Textul, sursele și navigarea se încarcă primele. Imaginea, interacțiunea și sunetul sunt adăugate apoi. Ideea rămâne ușor de urmărit pe ecrane mici, dispozitive mai lente sau cu mișcarea redusă.
Cum este construită experiența
Conținutul primul. Efectele după.
Pagina poartă sensul. Imaginea, interacțiunea și sunetul o fac mai vie, dar nu sunt singurul mod de a o înțelege.
- Colecție publică
- 1
- Studii interactive
- 3
- Control pe telefon
- Atingere
- Surse lângă explicații
- 25
Studiul 01 / Câmp viu
Studiul 02 / Secundă planetară
Studiul 03 / Arhivă fizică
- Pagină ușor de citit
- Imagine generată în timp real
- Derulare și atingere
- Sunet opțional
- Aceeași idee fără efecte
Dacă un efect vizual nu este disponibil, capitolul are în continuare sens.
- 01
Pagina explică subiectul, păstrează sursele aproape și oferă o ordine clară de citire înainte să se încarce efectele.
- 02
Imaginea generată în timp real oferă fiecărui studiu un model propriu, fără să înlocuiască pagina de bază.
- 03
Derularea și atingerea schimbă aceeași stare, astfel încât experiența rămâne ușor de înțeles pe orice dispozitiv.
- 04
Sunetul este opțional și urmează ce se întâmplă deja pe ecran.
F08 / Telefon
Telefonul păstrează ideea, nu fiecare control de pe calculator.
Pe un ecran mic, controalele în plus dispar, iar imaginea devine mai simplă. Subiectul, interacțiunea principală, ordinea capitolelor și sursele rămân. Este același proiect, fără să tratăm telefonul ca pe un calculator.
Frontier Atlas / Telefon
Aceeași idee.
Mai puține
mecanisme.
Versiunea de telefon păstrează capitolul, subiectul activ și interacțiunea importantă. Restul devine mai discret.
Subiect activ · citire clară · controale pentru atingereDeschide experiența publică ↗- Subiect activ
- Rămâne interactiv
- Citire
- Explicația și sursele rămân
- Atingere
- Controale potrivite ecranului
Vedere publică pe telefon · referință 390 × 844
O colecție publică cu trei studii terminate.
Acest proiect propriu nu are indicatori de afaceri. Rezultatul este munca: o colecție publică, trei experiențe diferite și o structură care poate susține alte studii în viitor.
- Colecție publică
- 1
- Un singur punct explică seria și îi lasă pe vizitatori să aleagă de unde încep.
- Studii interactive terminate
- 3
- Fiecare subiect are propriul model vizual și propriul fel de interacțiune.
- Surse lângă explicații
- 25
- Referințele stau lângă afirmațiile și imaginile pe care le susțin.
- Experiență pe telefon
- Atingere
- Ideea principală și interacțiunea rămân pe ecrane mai mici.
Cum rămâne totul legat
Ideea rămâne ușor de înțeles când un efect este oprit.
- Titlurile, navigarea și sursele rămân conținut normal al paginii
- Mișcarea poate fi redusă fără pierderea capitolului
- Sunetul începe numai la cererea vizitatorului
- Fiecare studiu are propria adresă pentru citire și distribuire
Frontier Atlas este un proiect făcut din inițiativă proprie, deci nu există venituri sau date despre public de raportat. Colecția principală este publică. Cele trei adrese separate pentru capitole mai au nevoie de ultima versiune. De aceea, acest proiect trimite spre colecție și nu prezintă acele adrese ca fiind gata.
Frontier Atlas / colecție publică