Făcând clic în jurul: utilizarea cursorelor circulare de mouse

Publicat: 2020-04-01

Recent, am discutat despre o tendință minusculă a cursoarelor mouse-ului, explorând o duzină de exemple de efecte singuratice, dar atrăgătoare. Astăzi a intrat din nou în lumina reflectoarelor, de data aceasta cu o altă idee interesantă.

Se pare că web designerii au o înclinație deosebită spre a se juca cu singurul nostru dispozitiv pentru deplasarea pe ecran. Fără îndoială, cursoarele câștigă în popularitate în aceste zile. Motivele pentru aceasta pot varia: pornind de la simpla dorință de a scăpa de tot ce este obișnuit și terminând cu ambiția arzătoare de a face web-ul un loc mai bun.

Am pășit într-o eră a interfețelor interactive. Cursorul mouse-ului este o parte integrantă a tuturor acestor soluții grandioase. Este logic ca acesta să sufere unele modificări pentru a satisface cerințele actuale și pentru a ajuta la crearea unei experiențe perfecte.

Se pare că a venit momentul să efectuăm câteva experimente cu forma sa, aruncând deoparte săgeata plictisitoare și optând pentru ceva mai elegant și mai rafinat, cum ar fi, de exemplu, un cerc. Forma rotundă se îmbină în mod ideal în interfețe moderne cu pânze și animații interactive. Se simte natural și grațios. Și, mereu se profilează în jur - atrăgând fără a se pătrunde atenția.

Ultimele proiecte de artă / Maraka

Să luăm în considerare Last Art Projects și Maraka, ale căror echipe folosesc această tendință minusculă în avantajul lor.

Last Art Projects are o temă frumoasă în două tonuri, populată cu ilustrații în stil de linie și decor gol. Aici, cursorul se potrivește perfect conceptului. Este format din două cercuri. Inelul din față este un cursor, în timp ce un cerc întunecat solid în spate este o coadă. Împreună arată ca o țintă care concentrează în mod natural atenția asupra ecranului.

Ultimele proiecte de artă

Maraka a schimbat forma cursorului, dar nu doar în scop decorativ. Aici este folosit ca un indiciu vizual pentru vizitatorii online. Astfel, arată o săgeată la stânga sau la dreapta când simte că doriți să parcurgeți diapozitivele. Și se transformă într-un cerc solid obișnuit (cu un cerc secundar relativ mare, semi-transparent) atunci când atingeți zona vizată, cum ar fi linkuri, subtitrări sau navigare.

Maraka

Ambele exemple ne arată cum o formă circulară simplă poate face minuni. Este atât de natural și elegant în comportamentul său încât se simte ca un partener ideal pentru toate aceste extravagante moderne. Să luăm în considerare și alte exemple fantastice.

Kwok Yin Mak

Kwok Yin Mak are un design spațios, cu o culoare tradițională alb-negru și ritm vertical. Personajele japoneze fură spectacolul aici. Atmosfera este rafinata si autentica. Trebuie să recunoașteți, o formă de săgeată implicită ar părea primitivă aici, dar o formă circulară este o altă problemă. Se joacă frumos cu toate detaliile și se simte ca acasă.

Kwok Yin Mak

Prime Park Sessions

Designul Prime Park Sessions este marcat de o estetică geometrică frumoasă. Elefantul poligonal complicat, navigație verticală situată pe părțile laterale și o tonă de spațiu alb. Aici, punctul negru minuscul al unui cursor se potrivește ca o mănușă, întâlnind cu pricepere tema.

Prime Park Sessions

Cartesiam

Forma de undă maiestuoasă dă tonul lui Cartesiam. Zona eroilor prezintă o animație abstractă frumoasă, strălucitoare și fluidă. Aici cursorul mouse-ului este un cerc relativ mare cu un nivel mediu de transparență. Datorită curbelor sale divine și comportamentului neted, atrage în mod natural atenția și, în același timp, se potrivește perfect anturajului deștept.

Cartesiam

Eum Ray

Portofoliul lui Eum Ray are un anumit nivel de personalitate. Artistul este dornic să-și arate geniul interior. Deci, nu este de mirare că totul aici este bine gândit. Chiar și cursorul mouse-ului iese în evidență din mulțime prin stilul său gol și forma circulară.

Eum Ray

Loc de joaca

Această tendință este folosită și pentru identificarea priorităților, adăugând greutate vizuală detaliilor cruciale. Aruncă o privire la Playground.

Echipa din spatele Playground-ului folosește două cercuri. Cercul mic este folosit ca cursor, în timp ce cel mare servește drept „follower”. Împreună, fac mișcările pe ecran mai proeminente. Și asta nu este tot: indicatorul are două tipuri de comportament. Când cursorul lovește un glisor, un buton hamburger sau o legătură – acesta crește, sugerând importanța acestor elemente. Când părăsește acele zone, se micșorează la dimensiunea obișnuită, permițând vizitatorilor să exploreze interfața fără prea multe bătăi de cap.

Loc de joaca

Tappezzeria Novecento

Tappezzeria Novecento are o zonă de eroi bogată în conținut, cu o imagine mare și mult conținut. Este firesc ca echipa din spatele designului să fi decis să facă cursorul mai proeminent. La fel ca și în cazul Playground-ului, are două cercuri: unul este un cursor în sine, iar celălalt este coada lui. De asemenea, are o colorare similară, ceea ce îl face o notă finală perfectă.

Tappezzeria Novecento

Mallard și Claret

Mallard și Claret demonstrează că un cursor circular al mouse-ului își poate găsi locul, chiar și în cele mai comune tipuri de site-uri web. De fapt, vei găsi două forme rotunde. Primul este un link către secțiunea de subsol, care se întâmplă să fie și un fel de logotip. Iar celălalt este un cursor de mouse. Este mic și vioi. Face experiența utilizatorului de pe acest blog puțin mai distractiv decât de obicei.

Mallard și Claret

Cadou de la Gucci

Numele cel mare aici, dar, din păcate, nu este un exemplu bun de urmat. Gift by Gucci are și un cursor circular de mouse. Cu siguranță își adaugă farmecul aici, iar interacțiunea cu pânza dinamică se simte mai naturală. Cu toate acestea, contrastul slab între fundal și prim-plan ruinează experiența utilizatorului. Cercul auriu este abia perceptibil pe un fundal roz. E pacat.

Cadou de la Gucci

Instrument bonus: Cursomizer

Dacă sunteți gata să renunțați la cursorul generic în formă de săgeată, atunci avem un proiect interesant de verificat. Se numește Cursomizer. Și face ceea ce spune - vă permite să personalizați cursorul. Este un mic loc de joacă în care puteți seta dimensiunea, culoarea, efectul de hover și efectele de clic pentru cursor și vă puteți bucura de aspectul și comportamentul final într-o previzualizare live. Este foarte la îndemână.

Cursomizer

Există doar ceva despre cercuri

Este întotdeauna un răsfăț să vezi lucruri banale, cărora uneori nu le acordăm credit adecvat, să obțină un al doilea vânt.

Desigur, am văzut multe cursoare personalizate. Cu toate acestea, există ceva divin în indicatoarele circulare. Se simte ca și cum se ridică și se mișcă ușor pe tot ecranul. În tandem cu o altă mică tendință, aka trasee circulare de șoarece, par și mai sofisticate.