Share
Voor dit vervolg op de reeks 'Een reeks pictogrammen voor digitaal schilderen maken' maken we een pentablet helemaal zelf, met name de Wacom 12-inch Cintiq-tablet. Dit model combineert aanraking en drukgevoeligheid, waardoor gebruikers direct op het scherm kunnen tekenen Deze functies maken het een favoriet voor illustratoren. Laten we aan het werk gaan.
Hieronder staan de vijf pictogrammen die we in deze serie maken.
Bekijk het voltooide pictogram voor deze zelfstudie. We tekenen de tablet en de stylus compleet met een glanzend scherm, knoppen aan de zijkant en blauwe LED-statuslampjes.
Start Photoshop en maak een nieuw RGB-leeg document en kies een vierkant canvas van 512 x 512 px. Kies een donkergrijze voorgrondkleur en selecteer vervolgens het gereedschap Afgeronde rechthoek (U) op de werkbalk. Voer in de optiebalk boven aan het scherm 30 px in voor de hoekradius (1a) en klik vervolgens met Alt en sleep vanuit het midden van het canvas om de hoofdtekst van de tablet te maken (1b). Met Alt-klikken worden vormen, selecties en transformaties rond de muis gecentreerd. Het is een vrij handige sneltoets, dus noteer het. Als u tevreden bent met de vorm, klikt u met de rechtermuisknop op de laag en kiest u Laag ragen. Noem het "basis".
Laten we nu vaststellen dat het licht van boven komt. Dit vereist dat we alle naar boven gerichte oppervlakken lichter maken en alle naar beneden gerichte oppervlakken donkerder. We zullen deze regel gedurende de hele tutorial volgen.
Het hoofdgedeelte van de tablet ziet er plat uit. Laten we wat verlichting toevoegen door een lichtgrijs als voorgrondkleur te kiezen en het vorige donkergrijs als achtergrondkleur te behouden (2a). Druk op G om het gereedschap Verloop te selecteren. Voordat we het verloop echter verven, laten we de transparantie van de "basislaag" vergrendelen door op het transparante vierkant bovenaan het palet Lagen (2b) te klikken. Nu kunnen we veilig over de hele tablet heen schilderen omdat we ons beperken tot de bestaande pixels. Schilder het verloop met een verticale lijn, van licht naar donker (2c).
Het oppervlak van de tablet is niet zo glad. Er is een heel fijne korrel. Om dat te creëren ga je naar Filter> Ruis> Ruis toevoegen en kies je voor 1%, Uniform en Monochromatisch (3a). Zie het resultaat (3b). We moeten de tablet ook een beetje dikte geven, dus dubbelklik op de "basislaag" om het venster Layerstijl te openen en klik op Afschuinen en reliëf. Raadpleeg afbeelding 3c voor de instellingen. Het tablet heeft nu dikte en een lichte ronding langs de randen (3d).
Laten we het glazen oppervlak tekenen. Selecteer opnieuw het gereedschap Afgeronde rechthoek (U), maar stel Radius in op 10 px (4a). Teken in het midden bovenaan een kleinere rechthoek en noem deze "glas" (4b). Rasteren, de transparantie vergrendelen en deze vullen met een verticale gradiënt van een middelkleurig naar een zeer donkergrijs (4c).
Het werkelijke actieve gebied is iets kleiner dan het glas en heeft scherpe randen. Teken het met het gereedschap Rechthoek en geef het een Overlay-stijl met verloop, licht tot middelgrijs (5a). Dit is ook het moment om een logo aan de onderkant van het glas toe te voegen. Gebruik het tekstgereedschap (T) en een heel lichtgrijs (maar niet wit) om je eigen logo toe te voegen (5b).
Het glas is geplaatst op het plastic basisoppervlak van de tablet. Dupliceer de laag 'glas' en noem de kopie 'glazen rand'. Stel de vulling in op 0% (6a). De werkelijke pixels van de laag zijn onzichtbaar, maar elke Layer Style die we toevoegen, niet. Dat is een leuke truc als je de contour van een laag wilt gebruiken zonder de inhoud ervan te tonen. Wat we willen is opnieuw Bevel en Emboss. Zorg ervoor dat u de "Omlaag" -optie kiest, die een insteekafschuining (6b) zal creëren. Nu heeft het glas een harde, ondiepe randinzet van de basis (6c).
Om het scherm te voltooien, voegen we een groot reflecterend hooglicht toe. Cmd-klik op het "glas" (7a) en vul dan een nieuwe laag met wit (7b). Noem het "reflectie" (7c). Gebruik de veelhoekige lasso-tool (L) om een schuine selectie te maken over de rechterkant van de laag (7d). Voeg de selectie toe als een masker (7e) en stel vervolgens de overvloeimodus van de laag in op Scherm, 20% dekking (7f). Het scherm is klaar (7 g), zodat we alle gerelateerde lagen nu kunnen groeperen (7 uur).
Kies voor het LED-licht het Ellips-gereedschap (U) en teken een 7x3 pixel, lichtblauwe ellips in de linkerbovenhoek van het tablet (8a). Noem het "LED 1" en voeg vervolgens een laagstijl voor de buitenste gloed (8b) en de binnenste gloed (8c) toe. We hebben nu een mooi gloeiend statuslampje (8d).
Dupliceer het LED-licht en voeg enkele symbolen eronder toe. Maak het zelf of refereer naar foto's van de daadwerkelijke Cintiq.
Aan de zijkant knoppen. Laten we eerst de touchstrip maken. Kies hetzelfde grijs als de "basislaag". Gebruik het gereedschap Afgeronde rechthoek (U) met een straal van 2 px om een dunne verticale strook aan de linkerkant van de glasplaat (10a) te tekenen. De strip is inzetbaar vanaf het hoofdgedeelte, dus laten we een Bevel en Emboss-stijl toevoegen (10b). Activeer ook de optie Contour (10c). Zie het resultaat (10d).
Naast de aanraakstrook bevindt zich nog een geschulpte sectie met de vier functietoetsen. Dupliceer de strip, verplaats deze naar rechts en verruim hem zodat de vier toetsen passen. Noem het "sleutelstrook."
Kies voor de functietoetsen een lichtere grijze kleur. Teken de bovenste toets met het gereedschap Rechthoek (12a) en noem deze "bovenste toets". De sleutel werpt een schaduw om zich heen. Maak die schaduw met een Outer Glow-stijl (12b). De resterende toetsen kunnen eenvoudig worden gemaakt door de "bovenste toets" te dupliceren, hun verhoudingen aan te passen en ze op de strip te plaatsen (12c).
Groepeer beide strips en de vijf sleutels in een groep met de naam "BUTTONS L." Dupliceer de groep, noem de nieuwe "KNOPPEN R", verplaats deze rechts van het glas en klap hem horizontaal (13a). Om de tablet te voltooien, voegen we een slagschaduw toe. Teken op een nieuwe laag onder de "basis" een dunne lange zwarte ellips. Stel het in op Vermenigvuldigen, 70% dekking. Ga naar Filter> Blur> Gaussian Blur en kies 3px. Het resultaat is een zachte, natuurlijk ogende schaduw (13b).
Tijd om de stylus nu te maken. Teken de rechterhelft van de pen met behulp van het gereedschap Pen in de Shape Layer-modus (14a). Maak de andere helft (14b) en voeg de twee vormen samen. Gebruik een medium grijs als basiskleur (14c). Noem de laag "penlichaam".
Laten we het belangrijkste hoogtepunt toevoegen. Dupliceer de penlaag en schaal deze horizontaal uit. Fleuren met Hue / Saturation (Cmd + U) of Brightness / Contrast (15a). Voeg ten slotte een 1px Gaussiaans vervagen toe om het met de onderste laag (15b) te vermengen. Mogelijk moet u de overvloeimodus van de markering instellen op Scherm, afhankelijk van de kleuren die u hebt gekozen en de gewenste resultaten. Noem de laag "penlichaamreflectie".
Gebruik het Rechthoekige selectiekader (M) en selecteer een dunne horizontale strook op de "penlichaamreflectie" -laag halverwege het taps toelopende uiteinde. Maak de selectie donkerder (16a). Selecteer nu de tip op beide lagen en wis ze, laat een plat uiteinde (16b) over.
Voeg de penpunt toe als een eenvoudige donkergrijze rechthoek (17a) op een laag onder het 'pennichaam'. De wisser kan worden gemaakt met een donkergrijze ellips, ook op een laag onder de pen (17b). Aangezien de gom afgerond is, moeten we wat kleurvariaties aan het oppervlak toevoegen. We doen dit met een Gradient Overlay-stijl (17c).
Teken de rubberen handgreep met een afgeronde rechthoek die enigszins taps toeloopt zodat deze naar boven (18a) flakkert. De straal moet erg klein zijn, ongeveer 3 px. Een verloopoverlay-stijl toevoegen (18b). De rubberen grip verschijnt nu rond (18c).
Laten we de zijknop op de stylus tekenen. Teken een donkergrijze rechthoek op een nieuwe laag, precies waar je duim zou zijn als je de stylus vastgreep (19a). Selectiekader: selecteer de onderste twee derde (19b) en druk vervolgens op Cmd + J om de selectie naar een nieuwe laag te kopiëren. Deze kant van de knop is naar boven gericht, daarom moeten we hem oplichten (19c). Raak Cmd + E om dit gezicht naar beneden samen te voegen. Nu hoeven we alleen een Outer Glow toe te voegen om het gat te simuleren waarin de knop is geplaatst (19d). De zijknop is voltooid (19e).
Groepeer alle lagen waaruit de pen bestaat en noem de groep "PEN" (20a). Houd de laagstructuur voor latere wijzigingen. Dupliceer de groep en druk op Cmd + E om alle lagen samen te voegen. Op dit punt kunnen we een Slagschaduw toevoegen (20b) en de stylus plaatsen waar we willen. We zijn klaar (20c).
Ik hoop dat je een paar trucs uit deze tutorial hebt geleerd. Misschien heeft je zelfs een tablet willen kopen! Zoals altijd met het pictogramontwerp vertrouwden we op vectorvormen en laagstijlen om maximaal effect en flexibiliteit te verkrijgen. Als u kleuren, diktes of lichtrichtingen wilt wijzigen, kunt u altijd teruggaan naar de lagenstructuur en de nodige aanpassingen aanbrengen. Tot de volgende keer voor ons definitieve ontwerp in deze serie, wanneer we een stadsbeeldscherm maken!
Accentsconagua