Fie că vorbim de interfața grafică a unui site sau a unei aplicații, tendința designerilor este de a simplifica interacțiunea vizitatorilor cu aceasta, astfel încât experiența să fie cât mai plăcută și intuitivă. Asta înseamnă că o interfață grafică presupune atât un design creativ, cât și o structură simplă, curată, clară, ușor de folosit, care să mulțumească nevoile utilizatorilor.
În articolul de astăzi o să vă prezentăm o serie de tutoriale și resurse gratuite, grupate pe categorii, care să vă ajute în procesul de creare a unor interfețe grafice cât mai eficiente, mai ales dacă vă aflați la începutul activității voastre profesionale.
Fonturi
Textul joacă un rol important în interfața unei pagini, întrucât, prin intermediul acestuia, ajungem la informațiile de care avem nevoie. Cu cât un font este mai proaspăt, mai clar și mai expresiv, cu atât utilizatorii parcurg textul mai ușor, iar impactul mesajului este mai mare.
Iată câteva fonturi gratuite mai creative care să vă ajute și să vă inspire:
Dual
Spider Type
Knit Type
Și o selecție cuprinzătoare, unde puteți unele dintre cele mai apreciate fonturi ale acestui an:
The 100 Greatest Free Fonts for 2014
Există o mulțime de alte surse unde puteți găsi fonturi; am mai făcut și noi o astfel de listă într-un articol anterior, la care putem adăuga Free Typography și Creative Beacon.
Icoane
Icoanele vin în mărimi și forme diferite, în funcție de scopul pentru care au fost create și utilizatorii vizați; important este ca acestea să fie atrăgătoare, sugestive, simple și intuitive.
Social HX Icons – 2D & 3D
Weather Icon Set
Flat Icon Set
Retro Style Icons
Line icon set
Ballicons Free
Butoane
Scopul unui buton este de a defini și indica o acțiune posibilă a unui utilizator, ceea ce înseamnă că acesta îl va orienta în direcția dorită. Deci, trebuie să atragă atenția prin formă sau culoare și să aibă un design cât se poate de explicit.
Iată câteva exemple de tutoriale care să vă ajute în crearea unor butoane:
How To Create Simple Flat Button
Create Simple Beautiful UI Buttons in Pixelmator
Și câteva resurse gratuite pe care să le puteți utiliza în proiectele voastre:
Flat Share Buttons
UI Flat Buttons
Free Cloud Hosting Upload Buttons
Slidere
Sliderele au un impact vizual destul de mare și de aceea este preferabil ca acestea să fie cât mai curate, clare, simple și ușor de manevrat. Asta nu exclude însă componenta creativității.
Iată câteva tutoriale care să vă ajute să vă creați propriile slidere, în funcție de necesități:
Creating a Custom UI Slider
Slider UI Design
Create a Colorful Image Slider in Photoshop
Design a Clean and Stylish Image Slider in Photoshop
Formulare de contact
Formularele de contact reprezintă modalități de acces ale utilizatorilor la diverse informații sau servicii. Fie că vorbim despre înregistrări pe un site sau într-o aplicație, înscrieri sau logări, cu cât sunt mai clare și mai ușor de completat, cu atât sunt mai eficiente.
Iată două tutoriale folositoare pentru realizarea de formulare de contact:
Login form
Simple contact form in Photoshop
Și câteva formulare gata create, numai bune de integrat în interfețele voastre:
Blur Login Form
BlueFit – Free Login PSD
Miscellaneous
Multe interfețe conțin widget-uri, elemente de configurare originale, cu scopuri pragmatice sau de divertisment, care se instalează și se execută în cadrul unei aplicații web sau mobile. Fie că este vorba de un calendar, un mediaplayer, un shortcut sau un blocknotes, un widget poate fi acel element care face diferența între două aplicații sau site-uri similare.
Mai jos vă prezentăm o serie de tutoriale care prezintă etapele conceperii unor astfel de instrumente:
Rotary Knob Control
Calendar Widget
Multimedia player
Iar în final, vă prezentăm câteva resurse gratuite pentru crearea unor funcționalități mai specifice, care vă pot fi utile în viitoarele voastre proiecte:
Checklist with stopwatch icon
Colorful Navigation
Numbers UI Kit
***
Acestea sunt doar câteva tutoriale și resurse care v-ar putea ajuta în activitatea voastră, mai ales dacă vă aflați la început de drum. Dacă știți și voi asemenea resurse, ne-am bucura să ne ajutați să completăm acest articol.
Post-ul Tutoriale și resurse gratuite pentru designul interfețelor apare prima dată în Ctrl-D.