nl.hideout-lastation.com
Paradijs Voor Ontwerpers En Ontwikkelaars


Hoe teken ik een Apple iCloud-pictogram - Photoshop-zelfstudie

iCloud, de nieuwste cloudopslagservice die door Apple is geïntroduceerd, heeft een vrij eenvoudig maar toch mooi logo. Het pictogram is gemaakt van metaalachtig materiaal en heeft een geëxtrudeerd cloudpictogram erop. Je weet het misschien niet, maar het maken van dit type pictogram is eigenlijk heel gemakkelijk, en hieronder is het iCloud-pictogram dat we je leren tekenen in dit bericht, met behulp van Photoshop!

Het ziet er een beetje ingewikkeld uit, maar eigenlijk hebben we slechts enkele laagstijlen, basis vectorvormen en een beetje handmatige tekening nodig. Laten we erin stappen!

Stap 1

Begin met het maken van een nieuw bestand met afmeting 512 x 512 px. Activeer gereedschap Afgeronde rechthoek. Stel op de optiebalk de straal in op 75 px. Klik en sleep om een ​​afgeronde rechthoek te tekenen. Stel de kleur in op # 5d5d5d.

Dubbelklik op de laag om het dialoogvenster Laagstijl te openen. Gradiëntoverlay toevoegen met standaardverloop, zwart naar wit en de dekking verlagen naar 76%.

Stap 2

Druk op Ctrl + J om de laagvorm te dupliceren. Klik op Bewerken> Vrije transformatie of druk op Ctrl + T om de transformatie uit te voeren. Stel de grootte in op de optiebalk tot 98%.

Verwijder in het deelvenster Lagen de stijl Laag door het pictogram fx naar het prullenbakpictogram te slepen, rechtsonder in het deelvenster Lagen. Dubbelklik vervolgens op de miniatuur van de lagen om het dialoogvenster Laagstijl te openen. Voeg binnenste schaduw en verloopoverlay toe.

Verander in de instelling van de verloopoverlay de stijl van de gradient in Angle. Klik op het voorbeeldvak van het verloop om de verloopeditor te openen en de kleurencombinatie # 8e8e8e, # a5a4a4 en # d8d8d8 te gebruiken. Voel je vrij om rond te spelen met elke markerpositie, zorg ervoor dat je dezelfde kleur instelt in de eerste en de laatste marker.

Dit is het resultaat na het toevoegen van laagstijlen.

Stap 3

Maak een nieuwe laag. Vul het met Radiaalverloop van wit naar zwart.

Houd Alt ingedrukt en sleep het vectormasker van de vorige laag naar de huidige laag. Het verloop past nu in het pictogram.

Open de laagstijl en wijzig de overvloeimodus in Scherm.

Stap 4

Teken een afgeronde rechthoek in het pictogram. Stel de straal in op 75px met kleur # 2a2a2a.

Voeg nog 2 cirkelvormen toe (kies Ovaal, houd dan Shift ingedrukt en sleep het). Stel de padmodus in op de optiebalk in het gebied Toevoegen aan vorm.

Dubbelklik op de wolklaag en voeg vervolgens Inner Shadow, Bevel and Emboss en Stroke toe.

Stap 5

Dupliceer de cloudlaag door op Ctrl + J te drukken. Verwijder de Layer-stijl door het fx-pictogram van de laagminiatuur naar het prullenbakpictogram te slepen. Verklein hem (Ctrl + T) tot 89%.

Verander de vorm in kleur naar # 5d5d5d. Sorteer de positie van elke vorm opnieuw totdat de kleine wolkgrootte evenredig is met de grotere wolk.

Dubbelklik op de cloudlaag en voeg de volgende laagstijlen toe.

Gebruik voor Gradient Overlay de exacte instelling van Gradient Overlay in stap 2.

Dit is wat we hebben na het toevoegen van laagstijlen aan de kleine wolk.

Stap 6: voeg metalen textuur toe

Het huidige ontwerp is erg vlak en te schoon. Laten we een subtiele metaaltextuur op het oppervlak toevoegen. Maak een nieuwe laag. Klik op Bewerken> Opvulling en selecteer Gebruik: Zwart om de nieuwe laag met zwart te vullen.

Klik op Filter> Ruis> Ruis toevoegen.

Klik op Filter> Vervagen> Radiaal vervagen. Selecteer Vervagingmethode: Draai en Kwaliteit: Beste.

Dit filter laat het geluid draaien en creëert een cirkelvormige golf.

Stap 7

Klik op Afbeelding> Aanpassingen> Niveau of druk op Ctrl + L. Sleep in het dialoogvenster de zwarte schuifregelaar in de uitvoerniveaus naar het midden om de cirkelvormige golf lichter te maken.

Houd Alt ingedrukt en sleep het vectormasker van de basislaag van het pictogram naar de huidige laag. De cirkelvormige golf bevindt zich nu in het pictogram.

Activeer het gereedschap Padselectie en selecteer het wolkenpad dat we in stap 4 hebben gemaakt. Druk op Ctrl + C om het op te slaan op het klembord. Druk op Ctrl + V om het op het vectormasker van de cirkelvormige golf te plakken. Stel de padmodus in op Aftrekken.

Kopieer en plak tenslotte het kleinere cloudpad dat we in stap 5 hebben gemaakt. Stel de padmodus in op Add to Shape.

Dit is het resultaat. De cirkelvormige golf bevindt zich in het oppervlak van het pictogram.

Verander de mengmodus van de laag naar scherm.

Stap 8: Schaduw

Maak een nieuwe laag en plaats deze achter alle lagen. Maak een elliptische selectie (met het gereedschap Ellips) onder het pictogram. Vul selectie met zwart.

Maak schaduw met filter, Gaussian Blur. Klik op Filter> Vervagen> Gaussiaans vervagen.

Dubbele schaduw door op Ctrl + J te drukken. Voeg nog een Gaussiaanse vervaging toe, gebruik voor deze keer een grotere straal om zachtere schaduw te krijgen. Als de schaduw nog steeds te hard is, kun je de laagdekking van de laag verlagen.

Eindresultaat

Dit is het resultaat van onze tutorial. Zoals u kunt zien, is het maken van dit pictogram heel eenvoudig. We moeten gewoon een paar basis vectorvormen en laagstijlen gebruiken. Ik hoop dat je deze tutorial leuk vindt. Als je vragen hebt, voel je vrij om te vragen!

Download PSD

Kan bepaalde stap niet worden bereikt? Hier is het PSD-bestand van het resultaat om te testen en mee te spelen.

  • iCloud Icon Tutorial PSD-bestand

6 CSS-trucs om inhoud verticaal uit te lijnen

6 CSS-trucs om inhoud verticaal uit te lijnen

Laten we het hebben over verticale uitlijning in CSS, of om preciezer te zijn hoe het niet uitvoerbaar is. CSS heeft nog geen officiële manier gegeven om inhoud verticaal in de container te centreren. Het is een probleem dat webontwikkelaars waarschijnlijk overal heeft gefrustreerd. Maar niet te vrezen, in deze post gaan we een aantal trucjes achter je laten die je kunnen helpen het effect na te bootsen .

(Technische en ontwerptips)

Bereken ROI's voor e-mailcampagnes met deze gratis tool

Bereken ROI's voor e-mailcampagnes met deze gratis tool

E-mail is al jaren de beste manier om de ROI te verhogen en rechtstreeks verbinding te maken met uw gebruikers (of klanten). Het kost tijd en moeite om e-mailmarketing te leren, maar de voordelen zijn enorm.Campagnemonitor schat dat gemiddelde e-mailcampagnes maar liefst $ 38 opleveren voor elke $ 1 die wordt besteed aan marketing

(Technische en ontwerptips)