Veebidisain

Disain eesmärgiga.
Mitte vaikevälimus.

Kohandatud visuaalne identiteet teie veebilehele — kirjatüübid, värv, paigutus ja liikumine koos läbi mõeldud. Väldime AI-üldist välimust ja indigosinise malli lõksu. Projektid alates 159€-st, Figma fail kaasa.

Mis teenus see on

Kohandatud veebidisain tähendab tahtlike valikute tegemist selle kohta, kuidas iga lehe osa välja näeb ja tundub — kirjatüüpide paaritamine, värvitokenid, vahekauguste rütm, varjude kihistamine, hover-olekud, liikumine ja see, kuidas kõik kohandub 1920px lauaarvutist alla 375px telefonini. WebSilm kujundab lehti, mis tunduvad läbimõeldud, mitte kokku pandud, ilma et langeksime ühte kahest levinud lõksust: liigselt mallindatud lohista-ja-jäta esteetika või üledisainitud näidisleht, mis võidab auhindu, aga ei konverteeri kunagi.

Iga projekt tarnitakse koos täieliku Figma failiga, mis kuulub teile — komponendid, disainitokenid, hover- ja active-olekud, mobiilibreikpunktid, kõik dokumenteeritud. Kui te kunagi vahetate arendajaid, võtab uus meeskond täpselt sealt järje üle, kus me lõpetasime.

Kellele see sobib

See sobib teile, kui …

I.

Teie praegune leht näeb üldine välja

Töötab, aga võiks olla mis tahes ettevõte teie sektoris. Soovite midagi, mis peegeldab teie iseloomu — ja vajate disainerit, kes vaidleb vastu, kui küsite turvalist varianti.

II.

Olete käivitamas uut toodet või stuudiot

Pole pärandlehte, mida säilitada, ainult selge ettekujutus, kuidas tahaksite, et teid tajutakse. Tõlgime selle ühtseks visuaalseks süsteemiks: tüüp, värv, paigutus, liikumine — valmis avaldamiseks.

III.

Teil on arendaja, aga pole disainerit

Vajate Figma faili, millest teie arendusmeeskond saab ehitada. Pakume ainult disaini — komponendid, tokenid, prototüübid — ja anname puhtalt üle. Teie arendaja säilitab täieliku kontrolli ehituse üle.

Mida te saate

Täielik visuaalne süsteem, mitte ainult ekraanid.

01
Kaks erinevat visuaalset suunda 1. nädalal
Üks turvalisem, teine julgem. Valite suuna (või võtate tükke mõlemast) enne, kui hakkame piksleid liigutama.
02
Täielik Figma fail, mis kuulub teile
Kõik lehed, komponendid, disainitokenid, hover- ja active-olekud. Dokumenteeritud nii, et iga arendaja saab selle hiljem üle võtta.
03
Kohandatud kirjatüüpide paaritamine
Seriifkiri ja sans, paaritud kontrasti ja koos läbimõtlemise jaoks. Laaditud woff2-na korraliku raskuse alamhulgaga — ei mingit Google Fonts CDN-i viivitust.
04
Kohandatud värvipalett ja tokenid
Defineeritud CSS-i kohandatud omadustena, et arendaja saaks neid kogu lehel kasutada. Ei mingeid Tailwindi vaikimisi nagu indigo-500.
05
Mobiilipõhised paigutused (esmalt disainitud, mitte viimasena)
Iga sektsioon paigutatud esmalt 375px-le, seejärel laiendatud tahvelarvuti ja lauaarvuti breikpunktidele. Testitud päris iPhone ja Android seadmetel enne lõplikku kinnitust.
06
Hover-, focus- ja active-olekud
Iga interaktiivne element on disainitud hover-olekuga, klaviatuuri fookuserõngaga ja active (vajutatud) olekuga. Vaikimisi ei jää midagi juhuse hooleks.
07
Liikumise juhised
Määratud easing-kõverad, kestused ja millised elemendid animeeruvad. Austab prefers-reduced-motion-i kasutajatele, kes vajavad liikumatust.
08
Arendajale valmis üleandmine
Tokenid eksporditud JSON-i / CSS-i kohandatud omadustena, komponendid sildistatud, äärejuhtumid dokumenteeritud. Teie arendaja saab ehitada ilma 50 järelpäringuta.
Aktiivsed näited

Hiljutised disainitööd.

Tööstus · Julge tüpograafia

Futex Grupp

Toimetuslik paigutus tugeva tüübi kontrastiga, täislaiusega kujundus ja vaoshoitud värvipalett, mis on ehitatud ühe brändi rohelise värvi ümber.

Vaata futex.ee →
Teenindus · Vaoshoitud minimalism

Massaaži Ekspress

Vaoshoitud minimaalne esteetika soojade neutraalsete toonide, suuremeelse tühja ruumi ja takistamata broneerimisvooga kui keskse disainiprioriteediga.

Vaata massage.websilm.ee →
B2B SaaS · Konversioonile keskendunud

eFirma

Usaldusmärgi-rohke SaaS-i turundusdisain — tugev hierarhia, sage sotsiaalne tõestus, selge CTA paigutus igas keritavas positsioonis.

Vaata efirma.websilm.ee →
Tööriistad ja põhimõtted

Millega kujundame — ja mida väldime.

Kujundame
Figma FigJam Cormorant Garamond Plus Jakarta Sans Inter Custom CSS tokens SVG icons Lottie

Figma kõige jaoks — komponendid, prototüübid, disainitokenid. Kirjatüüpide paaritamised valitakse projektipõhiselt usaldusväärsete komplektide hulgast. Ikoonid on kohandatud SVG (mitte ikoonifondid), liikumine on päris CSS-üleminekud või vajaduse korral Lottie.

Väldime aktiivselt
Indigo-500 / blue-600 Flat shadow-md Single sans-serif Default Tailwind Hero image right of headline Stock photo people in offices transition-all

Vaikimisi seaded, mis tähistavad lehte AI-genereerituna või mallipõhisena. Valime kohandatud brändivärvi ja tuletame sellest, kihistame varjusid peene värvitooniga, paaritame display- ja body-fonte ning animeerime ainult transform ja opacity — mitte kunagi iga omadust korraga.

Kohandatud disain vs mallid

Miks kohandatud disain ületab 59-dollarist mallist.

Aspekt WebSilm kohandatud disain Teema / mall AI veebisaidi generaator
Visuaalne originaalsus Ehitatud ainult teie brändile Kasutab 200–10000+ muud lehte Indigo + lame + sans — universaalselt
Kirjatüüpide paaritamine Display + body, valitud brändipõhiselt Üks sans, vahel vahetatud Inter või vaikimisi süsteemikiri
Värvipalett Kohandatud palett + ligipääsetav kontrast Piiratud malli eelseatud teemadega Indigo / sinise vaikimisi
Hover- ja focus-olekud Disainitud iga interaktiivse elemendi jaoks Üldine allakriipsutus / läbipaistvuse vaikimisi Sageli täielikult puudu
Liikumise disain Määratud kõverad, austab reduced-motion-i Komplekteeritud animatsioonid, mida ei saa häälestada Pole või transition-all kõikjal
Mobiili kogemus Disainitud mobiili-esimese, päris seadmel testitud Lauaarvuti paigutus kahandatud sobivaks Ainult mobiili eelvaade — pole testitud
Parim jaoks Brändid, mis peavad tunduma eristuvad Kõrvalprojektid, sisemised tööriistad Idee valideerimine nädalavahetusel
Veebidisaini küsimused

Mida kliendid küsivad enne disaineri palkamist.

Ausad vastused disainiküsimustele, mis tekivad enne iga projekti.

Mida WebSilm-i veebidisain tegelikult sisaldab?
Täielik visuaalne identiteet teie veebilehele: paigutuse süsteem, kirjatüüpide paaritamine, värvipalett, komponentide raamatukogu, hover- ja active-olekud, mobiilibreikpunktid ning Figma fail, mille saate hiljem kellelegi arendajale üle anda. Kasutame võimaluse korral moodsaid brauseripõhiseid tööriistu — saidid on kujundatud päris CSS-is, mitte tasapinnaliste maketistena, nii et see, mida demos näete, on see, mida tootmisesse saadetakse.
Kas mul peab enne alustamist brändiidentiteet olema?
Abiks, aga mitte kohustuslik. Kui teil on logo, brändivärvid ja toon, ehitame nendele. Kui pole, kulutame esimese 30 minutit avakohtumisel paletti, kirjatüüpide paaritamise ja visuaalse suuna määratlemisele koos. Me ei ole brändistrateegiaagentuur — täielikuks identiteedi uuendamiseks suuname teid disaineritele, keda usaldame, aga veebilehega seotud identiteedi puhul saame teid algusest avaldamiseni viia ise.
Kuidas otsustate, milline leht peaks välja nägema?
Alustame kolme viiteveebisaidi-iga, mida imetlete (teie tööstuses või väljaspool seda), pluss kolme saidi-iga, mis teile aktiivselt ei meeldi. Õpime tagasilükkamistest rohkem kui lemmikutest. Sealt pakume esimesel nädalal kaks erinevat visuaalset suunda — üks turvalisem, teine julgem. Valite suuna (või võtate tükke mõlemast) ja sealt edasi täpsustame. Ei mingit ainult-meeleolutahvli faasi, mis võtab kolm nädalat.
Kas mu leht näeb välja nagu iga teine moodne veebileht?
Ei. AI-tööriistad ja malliturud toodavad teatud vaike-esteetikat — lamedad varjud, indigo sinine, üldine sans-serif, kangelaspilt-paremale — ja me väldime seda aktiivselt. Paaritame seriifkirja sans-iga tüpograafilise huvi pärast, ehitame kohandatud värvitokenitega (mitte Tailwindi vaikimisi), kasutame mitmekihilisi varjusid peene värvitoonimisega ning disainime tahtlikus vahekauguses, mitte 4px võrgustikus. Tulemus on läbimõeldud, mitte genereeritud.
Kuidas käsitlete parandusi?
Iga projekt sisaldab 1–2 paranduste vooru visuaalsel suunal. Kogume tagasiside ühe korraga (märkmetega ekraanitõmmised või Loom video töötavad kõige paremini), seejärel tuleme tagasi järgmise iteratsiooniga 2–3 päeva jooksul. Kui läheme üle kaasatud voorudest, ütleme seda ette ja teeme väikese laienduse pakkumise — tavaliselt 80–200€ olenevalt mahust. Me ei polsta kunagi vaikselt arvet.
Kas disainite mobiili esimese?
Jah — iga projekt disainitakse mobiili-esimese põhimõttega, sest seal on tegelikult 60–70% teie külastajatest. Disainime mobiilipaigutuse lõpuni enne, kui puudutame lauaarvutit, ja siis laiendame sealt. See väldib levinud viga lauaarvuti paigutuse pigistamisest telefoniekraanile, mis lõpetab liiga väikese tekstiga või sõrmepuutele liiga lähestikku asuvate nuppudega.
Mis siis, kui mulle esimene disainisuund ei meeldi?
Siis läheme uuesti — täpselt seetõttu pakume esimesel nädalal kahte suunda, mitte ainult ühte. Kui kumbki ei tööta, paneme paika 30-minutilise kõne, vaatame viiteid uuesti, tuvastame, mis konkreetselt ei istu, ja pakume kolmanda suuna 3–4 päeva jooksul. Meil on viie aasta jooksul olnud ainult üks projekt, kus pidime nullist alustama, ja selle vooru eest ei küsinud me lisatasu.
Kas saate teha mu olemasoleva lehe ümberkujunduse ilma arendust muutmata?
Jah. Umbes viiendik meie disainitööst on 'uuskujundus pealmise kihina', kus pakume uue visuaalse kihi (Figma fail pluss CSS-i selle rakendamiseks) ilma aluseks olevat CMS-i või raamistikku puudutamata. Eriti levinud WordPress-i lehtedel, kus sisu on korras, aga disain on vananenud. Hind selle eest erineb rohkem kui uutel ehitistel — tavaliselt 600–1800€ — sest piiranguks on olemasoleva malli võimaldatav.
On olemas bränd, mida tõlkida, leht, mida ümber kujundada, või tühi leht? Loome midagi eristuvat.
Saa tasuta demo — ettemakseta