Share
Wat je gaat creërenVolg deze tutorial en leer hoe je van een website een winterwonderland maakt. U kunt de menubalken en -knoppen helemaal zelf maken, of u kunt deze technieken gebruiken en uw eigen items versieren. In het begin maakt u een eenvoudige menubalk en leert u hoe u de sneeuw en de ijspegels, sneeuwvlokken, glitters en meer decoraties met een winterthema toevoegt. Aan het eind experimenteren we met meer kleuren en ontwerpen, dus laten we aan de slag gaan!
Lancering Adobe Illustrator en ga naar Bestand> Nieuw om een leeg document te openen. Typ een naam voor uw bestand en stel de afmetingen in en selecteer vervolgens pixels zoals eenheden en RGB zoals Kleur mode. Ga vervolgens naar Bewerken> Voorkeuren> Algemeen en stel de Toetsenbordverhoging naar 1 px en terwijl je daar bent, ga je naar Eenheden en weergaveprestaties om ervoor te zorgen dat de eenheden zijn zoals in de volgende afbeelding. Ik werk meestal met deze instellingen en zij zullen je tijdens het tekenproces helpen.
Grijp de Afgeronde rechthoek-tool en teken de eerste vorm met de getoonde afmetingen. Selecteer paars als vulkleur.
Terwijl de rechthoek nog steeds is geselecteerd, gaat u naar Verschijning paneel en met de paarse Vullen attribuut geselecteerd, druk op de Geselecteerd item dupliceren pictogram onderaan. Als gevolg hiervan krijg je een seconde Vullen attribute hierboven. Gebruik een wit tot zwart lineair verloop bij a -90 graden hoek, en stel de Overvloeimodus naar Zacht licht.
Met de rechthoek nog steeds geselecteerd, dupliceert u de paarse Vullen attribuut opnieuw. Selecteer de nieuwe Vullen attribuut vanaf de bodem, dezelfde vullingskleur behouden en ga dan naar Effect> Stileren> Slagschaduw en pas dit effect vier keer toe. Laten we deze vorm "bar-base" noemen.
Dit zijn de instellingen voor de Slagschaduw bijwerkingen:
volgende, Kopiëren en Plak aan de voorkant (Control-F) de "bar-base" en verwijder vervolgens alle bestaande verschijningen door op te drukken Duidelijke verschijning pictogram onderaan de Verschijning paneel. Selecteer zwart als vulkleur en ga naar Object> Verloopnet maken, kiezen 3 rijen en 6 kolommen en druk op OK. Als resultaat krijg je een raster zoals in de volgende afbeelding.
Pak nu de Direct selectie gereedschap (A) en gebruik het om alleen de drie mesh-punten te selecteren die hieronder worden aangegeven en verander hun vulkleur van zwart in de overeenkomstige kleur. Nadat je klaar bent, zet je deze vorm op Overvloeimodus Zacht licht. Laten we deze vorm "bar-mesh" noemen.
Neem de Rechthoekgereedschap (M) en teken een rechthoek met dezelfde hoogte als je menubalk en plaats deze in het midden. Selecteer lichtblauw als vulkleur.
Met de blauwe rechthoek nog geselecteerd, ga naar Object> Pad> Ankerpunten toevoegen om vier extra punten aan de zijkanten toe te voegen (1). Gebruik de Direct selectie gereedschap (A) om alleen de linker- en rechterpunten in het midden te selecteren en verplaats ze 10 px naar binnen door op te drukken Links en Pijltoetsen rechts op je toetsenbord (2).
Ga vervolgens naar de Verschijning paneel en dupliceer het bestaande blauw Vullen attribuut. Voor het nieuwe Vullen selecteer bovenaan een wit tot zwart lineair verloop bij a -90 graden hoek en stel de Overvloeimodus naar Zacht licht (3).
Bekijk de rechterkant van de blauwe vorm van dichterbij. Neem de Pen gereedschap (P), teken een V-pad langs de ankerpunten van de blauwe vorm en geef het een 1 pt wit Beroerte. Kopiëren en Plak aan de voorkant (Control-F) dit pad en verplaats de kopie vervolgens 1 px naar rechts door op te drukken Pijltoets rechts een keer. Selecteer een 1 pt zwart Beroerte voor het tweede pad. Nu, Groep (Control-G) de twee paden en stel de groep in Overvloeimodus Zacht licht.
Vergeet niet hetzelfde aan de linkerkant van de blauwe vorm te doen of gewoon de bestaande groep weer te geven.
Nu onze eenvoudige menubalk gereed is, kunnen we verder gaan met de sneeuw en de andere decoraties. Om de sneeuw toe te voegen, raad ik aan de Pencil Tool (N) in plaats van de Pen gereedschap (P) omdat het gemakkelijker is en we zullen ook die vrije-hand / natuurlijke look krijgen, wat in termen van sneeuw een goede zaak is. Dubbelklik op de Pencil Tool (N) om de te openen voorkeuren venster en wijzig de instellingen. Je kunt hieronder de degenen zien die ik heb gebruikt, maar voel je vrij om de Trouw en de Gladheid naar je zin.
Eenmaal ingesteld, zoomt u in op de rechterkant van uw menubalk en tekent u een pad dat lijkt op het pad hieronder. Je hoeft niet te precies te zijn: hoe meer willekeurige, hoe beter.
Nog steeds met behulp van de Pencil Tool (N), teken een ander willekeurig pad onder de eerste en zorg ervoor dat u slechts een klein deel van de menubalk bedekt. Als de eindpunten van de twee paden elkaar niet overlappen, kunt u de Direct selectie gereedschap (A) om ze op elkaar te plaatsen zoals in de close-up.
Vervolgens is het tijd om de twee paden samen te voegen. Sleep een selectie met de Direct selectie gereedschap (A) over de twee eindpunten van rechts (zorg ervoor dat de menubalk eerst is vergrendeld) en druk op Besturing J naar toetreden hen. Controleer de Hoek optie en druk op OK. Sleep daarna een selectie over de twee eindpunten van links en toetreden ze ook. Vul de resulterende vorm met wit.
Nog steeds met behulp van de Pencil Tool (N), teken een nieuw pad onder de witte vorm, maar heel dichtbij. De lengte van dit pad moet ongeveer hetzelfde zijn als de witte vorm (1). Ga op dit punt naar de Pen gereedschap (P) en sluit de twee eindpunten aan de bovenkant om een vorm te krijgen (2). Kopiëren en Plak aan de voorkant (Control-F) de witte vorm en druk vervolgens op Shift-Control-] om het voor alles te brengen. Selecteer deze nieuwe witte kopie samen met de blauwe vorm en druk op Aftrekken in de verkenner paneel. Je krijgt een samengesteld pad (3) maar ga naar Object> Samengestelde pad> vrijgeven en verwijder de kleinere vormen bovenaan (4).
Vul de vorm die u in de vorige stap hebt verkregen met de aangegeven kleur en op dit punt is het eerste "stuk" sneeuw gereed.
Neem de Pencil Tool (N) opnieuw en teken een kleinere vorm aan het rechteruiteinde van de menubalk gevuld met wit (1). Teken een ander pad eronder en zorg ervoor dat de rechter- en linkeruiteindpunten elkaar overlappen (2) en sluit vervolgens het pad aan de bovenkant zoals u eerder deed, met behulp van de toetreden functie of de Pen gereedschap (P) (3). Kopiëren en Plak aan de voorkant (Control-F) de kleine witte vorm en druk op Shift-Control-] om het voor alles te brengen. Selecteer deze witte kopie samen met de blauwe vorm en druk op Aftrekken in de verkenner paneel. Vul de resulterende vorm met dezelfde kleur (4). Dit is het tweede "stuk" sneeuw.
Laten we meer sneeuw toevoegen aan de linkerkant van de balk met dezelfde techniek. Teken eerst de witte vorm met de Pencil Tool (N) (1), en maak dan de vorm eronder door af te trekken (2), en vul hem met dezelfde lichtblauwe kleur (3).
Ga door met het toevoegen van meer "stukken" sneeuw, sommige groter of iets kleiner, totdat je de bovenkant van de menubalk volledig bedekt. Je kunt in de volgende afbeelding het eindresultaat zien.
Gebruik de Pencil Tool (N) of de Pen gereedschap (P) om een vorm zoals hieronder te tekenen en deze te vullen met de getoonde lineaire helling. Je kunt ook een paar kleinere vormen ernaast tekenen die met hetzelfde verloop zijn gevuld en vervolgens alle vormen en Groep (Control-G) hen.
Gebruik de groep vormen die u zojuist hebt gemaakt om meer details over de sneeuw toe te voegen. Maak meer kopieën van de groep en schaal, draai ze en rangschik ze boven op de sneeuw.
Gebruik de Pencil Tool (N) om een willekeurige vorm in de rechterbenedenhoek van de menubalk te tekenen en wit als vulkleur te selecteren. Pak nu de Ankerpunttool toevoegen (+) en gebruik het om een paar extra punten aan de onderkant van deze vorm toe te voegen (1). Schakel vervolgens over naar de Direct selectie gereedschap (A) en sleep slechts drie van deze punten naar beneden om de eerste ijspegels te maken (2). Voeg meer punten toe met behulp van de Ankerpunttool toevoegen (+) over de lengte van de ijspegels, en speel met hun handvatten om de golvende look te creëren (3).
Teken een nieuwe willekeurige vorm naast de eerste en voeg vervolgens meer punten aan de onderkant toe met de Ankerpunttool toevoegen (+) (1). Gebruik de Direct selectie gereedschap (A) om twee van deze punten naar beneden te slepen om twee nieuwe ijspegels te maken (2). Voeg meer ankerpunten toe langs de lengte van de ijskegels en verplaats hun handvatten om de golvende look te creëren (3).
Ik heb naast de tweede een witte vorm toegevoegd, maar je kunt er zoveel toevoegen als je wilt. In deze tutorial is het ontwerp aan jou.
Selecteer nu de drie witte vormen rechtsonder in de menubalk, en Kopiëren en Plakken op de rug (Control-B). Verplaats deze drie exemplaren een beetje naar beneden door op te drukken Pijltoets omlaag op je toetsenbord een of twee keer, en selecteer lichtblauw als vulkleur.
Om meer diepte toe te voegen, tekent u met de Pencil Tool (N) of de Pen gereedschap (P) een dunnere vorm bovenop elke ijskegel, en vul ze allemaal met het verloop weergegeven.
Om meer details toe te voegen, tekent u een paar kleinere vormen waar u vrije ruimte heeft en vult u deze in met de aangegeven kleur.
De rechteronderkant van de balk is klaar, maar je kunt meer ijspegels aan de linkerkant toevoegen. Deze zijn kleiner, dus ze zullen niet lang duren om te maken. Gebruik dezelfde techniek als hierboven beschreven. Teken eerst de witte vorm (1) en vervolgens Kopiëren en Plakken op de rug (Control-B) deze vorm, verplaats hem iets naar beneden en verander de vulkleur (2). Gebruik aan het einde kleinere vormen gevuld met hetzelfde verloop om zoveel details toe te voegen als je wilt (3).
Gebruik dezelfde techniek, voeg meer ijspegels toe in de linkerbenedenhoek van de menubalk en op dit punt ben je klaar met de sneeuw en de ijspegels.
Ga naar Sneeuwvlok en download de vector sneeuwvlokkenset gemaakt door All-Silhouettes. Open vervolgens het Illustrator-bestand uit het archief en kopieer de sneeuwvlok gemarkeerd met blauw in uw document. Selecteer wit als vulkleur en sleep de sneeuwvlok naar de Borstels paneel om het op te slaan als een Nieuw scatterpenseel. In de Opties voor verstrooiingsborstel venster, stel de Rotatie ten opzichte van pad en laat de rest van de instellingen zoals ze zijn. Typ een naam voor het penseel en druk op OK.
Neem nu de Pencil Tool (N) opnieuw en teken enkele paden boven de sneeuw zoals in de volgende afbeelding. Beroerte deze paden met de Sneeuwvlokverstrooiingspenseel eerder opgeslagen en open de Lijn opties venster van de Verschijning paneel. Wijzig de instellingen zoals getoond en druk op OK. Stel de Berekend gewicht voor deze paden op 0.25 pt, 0.3 pt, 0.35 pt en 0,5 pt om sneeuwvlokken van verschillende formaten te krijgen.
Kopieer de sneeuwvlokken gemarkeerd met blauw en groen van de sneeuwvlokken ingesteld in uw document. Vul ze vervolgens met wit in, schaal ze en rangschik ze aan de linkerkant van de menubalk.
Vervolgens, van de Symbolen paneel open de Symboolbibliotheek Menu en in de Natuur categorie zoeken "Bomen 1”. Sleep het symbool naar uw tekengebied en druk op Verbreek de link met het symbool pictogram onderaan de Symbolen paneel om het uit te breiden. Schaal en rangschik de bomen op de top van de sneeuw en vermenigvuldig deze als je meer wilt toevoegen.
Kijk nu eens goed naar de bomen. Grijp de Pencil Tool (N) en trek wat korte paden langs de takken van de grotere boom. Beroerte deze paden met de Charcoal-Thin Art Brush waar je in kunt vinden Penseelbibliotheken Menu> Artistiek> Artistic_ChalkCharcoalPencil. Stel de Berekend gewicht naar 0,5 pt en de kleur naar wit voor allemaal.
Herhaal hetzelfde proces voor de andere bomen maar verminder de Berekend gewicht zelfs meer omdat de bomen kleiner zijn.
Vermenigvuldig de met sneeuw bedekte bomen die u hebt gemaakt en rangschik meer aan de andere kant van de menubalk.
Om het kleine huis te creëren, begint u met het tekenen van een eenvoudige huisvorm gevuld met wit. Teken voor het dak een pad met een 1 pt rood Beroerte en voeg een kleine rode vorm toe als de schoorsteen. Gebruik voor de deur en ramen de Rechthoekgereedschap (M) en de getoonde gradiënt. Om de sneeuw op het dak te creëren, tekent u eenvoudigweg twee paden bovenop het dak en Beroerte zij met de Charcoal-Thin Art Brush zoals je eerder deed voor de bomen.
Neem vervolgens de Ellipse Tool (L) en teken drie ellipsen om de sneeuwpop te maken. Vul ze met de weergegeven radiale kleurovergang en voeg vervolgens kleine zwarte cirkels toe als ogen en knoppen. Gebruik de Pen gereedschap (P) om een neus en de sjaal te tekenen, en je bent klaar.
Op dit punt kunt u het kleine huis en de sneeuwman regelen waar u wilt.
Het lijkt verplicht om veel sparkles toe te voegen, toch? Ik heb al uitgelegd hoe je er een kunt maken in de zelfstudie Glitter Text Art Effect. Vermenigvuldig de schittering en rangschik zoveel als je wilt om je ontwerp te verbeteren.
Als het je gelukt is om dit punt te bereiken, kun je een eenvoudige knop maken en versieren in plaats van een balk. Begin met het tekenen van een kleinere afgeronde rechthoek (1) en maak vervolgens het rastergaas zoals uitgelegd aan het begin van de zelfstudie (2). Voeg "stukken" sneeuw aan de bovenkant toe en ijspegels aan de onderkant (3) en gebruik de Sneeuwvlokverstrooiingspenseel om meer sneeuw toe te voegen (4). Sorteer de decoraties die u hebt gemaakt (5) en voeg ten slotte een paar sprankelingen toe (6). Alle technieken blijven hetzelfde.
Dupliceer of vermenigvuldig de eerste knop en plaats eenvoudig de bestaande decoraties om meer knoppen te krijgen.
Dupliceer de paarse menubalk met de sneeuw bovenaan, de sneeuwvlokken en de ijspegels, maar zonder de andere decoraties. Selecteer "bar-base" en vervang paars door de aangegeven groene kleur. Houd de overige instellingen zoals ze zijn.
Selecteer vervolgens de vorm in het midden en vervang de lichtblauwe door lichtgroen. Rangschik alle decoraties op een andere manier en je krijgt een nieuwe menubalk.
Om de grijsachtige menubalk te maken, dupliceert u de paarse balk opnieuw. Selecteer "bar-base" en vervang paars door de aangegeven grijstint. Selecteer daarna de vorm in het midden en vervang deze keer het lichtblauwe met roze. De rest van de instellingen blijven hetzelfde. Tenslotte, rangschik alle decoraties zoals je wilt.
Deze menubalken en knoppen zijn vrij eenvoudig en ze helpen met de demonstratie, maar voel je vrij om andere website-elementen te gebruiken om deze winter wonderland-look te creëren. U kunt helemaal opnieuw beginnen of u kunt slechts enkele items gebruiken om uw eigen menu's en knoppen te versieren. Het is absoluut verplicht om veel plezier te hebben terwijl je dit doet, en als je je winter-wonderland-creatie wilt delen, zou ik het graag zien.
Accentsconagua