Arhiva pentru tagul “Webdesigneri”

LayoutIt: "desenezi" cu Bootstrap

Cu ceva vreme în urmă, Twitter Bootstrap a ajuns la versiunea 3. Între puţinele instrumente online care s-au aliniat noii versiuni este Layout It, un excelent mod de a porni un design cu Bootstrap. De fapt merge şi cu 2, dacă aţi rămas fani ai versiunii anterioare. Dacă însă vreţi să fiţi la zi, daţi click pe Start Now with Bootstrap 3! Veţi scuti câteva minute, chiar zeci de minute, în care aţi scrie linie cu linie partea HTML şi JavaScript necesară diferitelor componente.

imagine

După cum se poate vedea în captura următoare, avem un editor vizual în care tragem cu mouse-ul componentele dorite pentru a crea designul dorit. Unele componente au şi opţiuni suplimentare, precum în cazul butoanelor. …


Box of Bundles: resurse gratuite şi pentru proiecte comerciale

Conceptul de enşpe chestii puse la bocceluţă – sau mai pe româneşte 😉 bundle, nu cred că vă este străin. Şi pe CNet.ro aţi putut citi despre diverse astfel de oferte la pachet. De regulă sunt cu preţuri foarte mici, evident mult mai mici decât dacă ai cumpăra separat fiecare “produs”. BoxOfBundles.com merge pe o altă idee: să reunească diverse resurse, oferindu-le gratis, promiţând doar faimă celor ce contribuie la proiect. Înţeleg că pachetul se va schimba lunar, dar aceasta rămâne de văzut după succesul proiectului.

imagine

După cum vedeţi mai jos, primul pachet are o dimensiune ne-neglijabilă (de fapt vreo 200MB ca arhivă, dar aproape 500MB despachetată. În arhivă probabil ochii designerilor vor fugi rapid la PSD-uri, unde găseşti …


365psd + MediaLoot

“Adobe a hotărât ca versiunile de Photoshop CS4 şi CS5 distribuite în România vor salva fişierele în format .pdl, nu .psd ca până acum!” Aşa suna un banc primit de la unul dintre cititori acum mai multe luni, când electoralele erau subiectul zilei (de fapt imediat după). Şi totuşi astăzi vă propun 365psd.com (nu 365pdl), un sit mic, micuţ, atât de mic încât dacă porniţi cu expectanţe mari veţi fi dezamăgit. Ideea e simplă: câte un fişier .psd gratuit în fiecare zi. Până acum sunt aproape 30. Sunt mărunţişuri dar se porneşte de la premisa: dacă eu tot am muncit de ce să nu pun public să fie şi altora de folos?

imagine

Veţi găsi astfel tot felul de meniuri, butoane, interfeţe, iconiţe… pe care le primiţi …


doTemplate: pictezi designuri

Poate vă amintiţi de un articol de acum câteva luni: Artisteer: pictezi designuri cu uşurinţă. Este un program în faţa căruia îmi ridic pălăria (şi dacă se găseşte un sponsor să ni-l dea cadou am putea “produce” teme şi difuza via CNet.ro – dar versiunea completă e foarte, foarte scumpă, 130usd). Un fel de variantă online, fără legătură între proiecte, este doTemplate. Aceeaşi idee, doar că acum ca webaplicaţie, nu program desktop. Porneşti de la nişte designuri existente şi le modifici după bunul plac, totul în navigator. La final exporţi ca arhivă ZIP fişierele şi le foloseşti pentru propriul sit (atenţie: în footer este un link spre doTemplate care sunteţi obligaţi să îl păstraţi – sau plătiţi 10usd).

imagine

De cum intraţi pe sit puteţi …


Pictaculous: palete de culori din imagini

Am văzut zilele trecute un poster care mi-a plăcut şi i-am făcut poză cu iPhone-ul meu. Mi-au plăcut culorile şi m-am gândit să le păstrez pentru viitor, spre inspiraţie. Mi-am spus: “Ce frumos ar fi să pot trimite poza prin email şi să primesc ca răspuns o paletă de culori bazată pe poză.” – Cam aşa s-ar putea rezuma povestea proiectului Pictaculous, povestită pe blogul MailChimp (fiind în fapt un proiect MailChimp). Este genul de proiect de interes în special pentru designeri (incluzându-se aici webdesigneri), care se simt inspiraţi de o anumită imagine. Pe de altă parte sunt unele proiecte de webdesign în care punctul de pornire este chiar o fotografie (sau mai adesea logo).

imagine

Procesul de folosire este cum nu se poate mai …


Artisteer: program pentru… webdesign

Sună puţin ciudat: un program cu care să realizezi designuri pentru situri (dar oricât de ciudat sună, nu este primul program de acest fel). Nu e vorba de un editor grafic specializat ci de un program care îţi permite să "pictezi" un design cam cum l-ai dori, la final exportând designul în setul de fişiere HTML plus imaginile necesare. După cum vedeţi mai jos, programul are o interfaţă a la MS Office 2007 şi are un maaaare buton numit Suggest Design. La apăsarea acelui buton designul se modifică aleator (culoare, elemente grafice, compoziţie…). Când aţi nimerit peste ceva ce vă place vă puteţi opri şi continua prelucrarea designului. Desigur, se poate porni şi de la "zero", adăugând pe rând antent, corp, bare laterale, meniuri, butoane… Partea foarte bună este că Artisteer vine cu o suită de galerii (de fundaluri, meniuri, butoane) care uşurează enorm munca.


BgPatterns.com: Decoraţiuni de fundal

Era o vreme (acum mai bine de 10 ani) când siturile se întreceau să pună ca fundal la pagină imagini repetate. Iar dacă erau cumva şi GIF-uri animate… atunci să te ţii dureri de ochi şi prost gust. Astăzi majoritatea preferă fundaluri fie cu gradient fie cu culoare unică. Uneori merg însă şi texturi artistice, iar BgPatterns.com este un excelent instrument pentru aşa ceva.

img171

Din mouse puteţi să "compuneţi" şi testaţi fundaluri. Practic aveţi patru taburi pentru manipulări. În primul puteţi opta pentru culoarea elementului repetitiv şi a fundalului. În a doua puteţi alege o textură pentru fundal (sunt câteva pentru moment disponibile). Al treilea tab include elementul repetitiv, având câteva zeci de opţiuni. Puteţi să măriţi sau micşoraţi imaginea, precum şi să stabiliţi gradul de opacitate/transparenţă. În ultimul pas puteţi roti imaginea, dacă dă un efect mai …


E iarăşi vremea iconiţelor

SmashingMagazine.com loveşte din nou cu articolul 55 Free High Quality Icon Sets. Noua colecţie include evident seturi de iconiţe excelente, atent selectate de pe web. Toate sunt gratuite pentru uz privat, unele şi pentru uz comercial. Cel mai bine este să verificaţi clar licenţa înainte de a le folosi, dat fiind că ea poate fi oricând schimbată. Seturile includ de la câteva iconiţe (5 de exemplu), până la câteva zeci ori peste o sută, cum e cazul iconiţelor de mai jos (128 în total în pachet).

img168

Cât priveşte rezoluţiile, mai toate sunt disponibile în diverse dimensiuni, ajungând şi până la 512x512px. Veţi găsi iconiţe pentru Windows, Max şi Linux, dar de regulă pe web se găsesc şi "convertoare" de la un format pentru un sistem de operare la altul. Partea cu dimensiunea mare a unora dintre iconiţe …


Imagini ce aşteaptă să fie scrise

Ştiţi maşinile acelea murdare pe care unii nu se abţin să scrie "Spală-mă"? Uneori în munca de design la un website ţi-ar prinde bine nişte spaţii pe care să scrii… dar totuşi curate. Iată că Hongkiat.com ne propune astăzi un articol foarte util: 40+ High Resolution Blank Template (Free) Stock Photos. E vorba de peste 40 de imagini de înaaaaltă rezoluţie care parcă abia aşteaptă să fie scrise. Sunt de pe preferatul meu, SXC.hu şi veţi avea nevoie de un cont pentru a le putea vedea. Preţ mic: situl SXC.hu e o comoară la capitolul fotografii, cum am mai tot scris de-a lungul anilor.

img13

La ce pot folosi aceste imagini? Doar imaginaţia poate pune limite! Poate vreţi să anunţaţi ceva pe situl Dvs sau să scrieţi numele sitului pe un "suport" mai special… sau mai ştiu eu ce. …


WebDesignerWall: câteva articole superbe

Am descoperit acum câteva zile un sit extraordinar: WebDesignerWall.com. E un blog unde se scrie rar (de câteva ori pe lună), dar sunt articole interesante şi din când în când promoţii (de exemplu componente flash comerciale, oferite gratuit). Sunt câteva articole care mi-au retras atenţia. Cel care m-a vrăjit cel mai mult e din ultima zi din februarie a.c.: jQuery Tutorials for Designers. Nu săriţi la alt articol doar pentru că, de exemplu, nu vă pasionează jQuery. Nu e vorba acum de un tutorial jQuery, adică de un articol introductiv despre această (minunată) librărie JavaScript.

img18

Nu. Este vorba în schimb de 10 scurte şi eficiente coduri care vă pot arăta – chiar dacă nu aţi folosit până acum niciodată jQuery – cum vă poate acesta ajuta să daţi o dinamică specială designului. Subliniez deci că …