Entwerfen Sie ein Forest Inspired Tumblr Theme in Photoshop
Tumblr ist eine Micro-Blogging-Plattform, die es Benutzern ermöglicht, einfach Informationsschnipsel im Web zu veröffentlichen, wie z. B. ein Foto oder Fotoset, ein Video, ein Zitat oder nur einen Absatz.
Es wird oft als Online-Tagebuch verwendet, da es im Vergleich zu anderen Blogging-Plattformen wie WordPress einfach zu bedienen ist.
Es gibt eine Menge Tumblr-Themen, sowohl kostenlose als auch erstklassige, aber hast du dich jemals gefragt, wie du deine eigenen entwerfen würdest?
In diesem Tutorial lernst du, wie du ein vom Wald inspiriertes Tumblr-Thema mit Holztexturen, subtilen Mustern und modernen Techniken erstellst - eine schöne Mischung aus natürlichen und modernen Elementen.
Was wir entwerfen werden
Das Thema, das wir in Photoshop entwerfen werden, besteht aus vier Bereichen: Holzseitenleiste, Hauptinhaltsbereich, rechte Seitenleiste und Kopfzeile.
Schritt 1
Der erste Schritt, wie es bei allen Dingen sein sollte, die du entwirfst, ist das Skizzieren. Mit meinem Wacom Bamboo Grafiktablett und einer leeren Leinwand in Photoshop skizzierte ich das folgende Design mit einigen größeren Elementen, um meine Ideen auf (digitalem) Papier zu lesen.
Schritt 2
Erstellen Sie ein neues Dokument in Photoshop. (Denken Sie daran, dies ist nicht in Stein gemeißelt. Es ist nur etwas, auf das Sie zurückgreifen können, wenn Sie im Design hängen bleiben. Persönlich tendiere ich dazu, zu experimentieren und viel von dem zu ändern, was ich ursprünglich geplant hatte.) Ich benutzte das Folgende Einstellungen in Photoshop:
Schritt 3
Die nächste Stufe besteht darin, einige Anleitungen auf die Leinwand zu bringen. Dies wird Ihnen helfen, die Struktur des Themas sauber zu halten, während Sie es entwerfen. Ich möchte, dass die linke Seitenleiste 200 Pixel groß ist, der Hauptinhaltsbereich 600 Pixel und die rechte Seitenleiste 160 Pixel, was uns eine Breite von 960 Pixeln ergibt.
Wenn Sie dieselben Einstellungen verwendet haben, können Sie Ihre Hilfslinien horizontal auf 200, 800 und 960 Pixel setzen. Dieser Entwurf wird links ausgerichtet, so dass die Seitenleiste aus Holz immer an der linken Seite des Ansichtsfensters des Benutzers anliegt.
Außerdem platzierte ich Hilfslinien 200 Pixel unter dem oberen Rand der Leinwand und 200 Pixel über dem unteren Rand der Leinwand. So sieht mein Dokument derzeit aus:
Schritt 4
Fügen wir nun unserem Hintergrund ein Muster hinzu. Gehen Sie zu Datei → Neu und erstellen Sie ein neues Dokument, das 8 × 8 Pixel groß ist. Zeichnen Sie einige vertikale Linien mit einer Breite von 2 Pixeln. Ihre Leinwand sollte jetzt 2 Pixel schwarz, 2 Pixel weiß, 2 Pixel schwarz, 2 Pixel weiß sein. Gehe zu Bearbeiten → Muster definieren. Speichern Sie Ihr Muster als "Vertikale Linien 2px".
Wechseln Sie in Ihrem Originaldokument zu Ebene → Neue Füllebene → Muster. Wählen Sie das soeben erstellte Muster und klicken Sie auf OK. Löschen Sie die Deckkraft der Ebene, bis sie etwa so aussieht:
Verknüpfen Sie das Muster mit Ihrer Hintergrundebene und rasterisieren Sie es dabei automatisch. Gehe zu Filter → Rauschen → Rauschen hinzufügen. Ändern Sie den Wert in 5% und klicken Sie auf OK. Dies fügt dem Hintergrund eine subtile Textur hinzu:
Erstellen Sie eine neue Ebene und füllen Sie sie mit Weiß. Positionieren Sie es unter der ursprünglichen Hintergrundebene. Verringern Sie die Deckkraft Ihres strukturierten Ebenenmusters auf etwa 40% und fügen Sie es dann mit der Hintergrundebene zusammen, indem Sie zu Ebenen → Ebenen zusammenführen wechseln.
Schritt 5
Wählen Sie das Rechteck-Werkzeug und zeichnen Sie eine Form, die 200 Pixel breit ist.
Wir werden den Grund unserer Form mit dem Polygon-Lasso abschneiden und so wie ein Band aussehen lassen. Erstellen Sie eine Auswahl über Ihrer Form, rastern Sie die Formebene und drücken Sie die Entf-Taste, um den ausgewählten Bereich zu entfernen.
Platzieren Sie die Form in der linken Seitenleiste, die wir mit unseren Hilfslinien markiert haben.
Erstellen Sie eine Auswahl des oberen Teils der Form und gehen Sie zu Bearbeiten → Freie Transformation. Strecken Sie die Form so, dass sie sich mit der oberen Linie der Leinwand überlappt.
Schritt 6
Wählen Sie das Ellipsenform-Werkzeug und zeichnen Sie, während Sie die Umschalttaste gedrückt halten, einen Kreis, der mit Weiß gefüllt ist. Positionieren Sie es oben in der Seitenleiste und benennen Sie die Ebene in "Hochformat" um.
Klicken Sie mit der rechten Maustaste auf die neue Formebene, und wählen Sie die Option "Rastergröße" aus, um sie von einem Smart-Objekt in Pixel umzuwandeln. Halten Sie die Befehlstaste gedrückt und klicken Sie im Ebenenbedienfeld auf das Vorschaubild der Ebene. Dies wird eine Auswahl Ihres Kreises treffen.
Suchen Sie ein Bild von sich selbst (oder was auch immer Ihre Website ist) und kopieren Sie es. Gehen Sie zurück in Photoshop und gehen Sie bei aktiver Kreisauswahl zu Bearbeiten → Einfügen in. Dadurch wird das Objekt in die Kreisauswahl eingefügt.
Nachdem Sie dies getan haben, haben Sie automatisch eine Ebenenmaske auf dem Bild erstellt (dh auf einer neuen Ebene, nicht auf der vorhandenen Kreisebene). Gehe zu Bearbeiten → Freie Transformation, um die Größe des Bildes zu ändern und / oder zu drehen. Es wird ein Kreis bleiben; Achte nur darauf, es nicht zu klein zu machen. Sobald dies erledigt ist, löschen Sie die Ebene "Portrait" und benennen Sie Ihre neue Ebene um.
Schritt 7
Wählen Sie das Textwerkzeug und erstellen Sie ein Textfeld im Kopfbereich. Ich habe meinem Thema einen völlig zufälligen Namen gegeben: "Kabooom". Ich benutzte eine Schriftart namens Reklame Script. Sie können eine Demo der Schrift herunterladen oder für $ 30 kaufen MyFonts .
Klicken Sie mit der rechten Maustaste auf Ihre Textebene und wählen Sie "Fülloptionen". Wenden Sie eine Farbüberlagerung auf den Text an. Ich habe ein helles Grau verwendet, das etwas dunkler als der Hintergrund ist, mit dem Hex-Code # D6D6D6.
Wenden Sie einen inneren Schatten auf den Typ an, indem Sie eine Deckkraft von 10%, eine Entfernung von 2 Pixel und eine Größe von 1 Pixel verwenden. Belassen Sie alles andere auf 0. Dadurch wird der Typ so aussehen, als wäre er im Hintergrund eingraviert.
Um den Gravureffekt zu vervollständigen, fügen Sie dem Typ einen Schlagschatten hinzu, indem Sie die Farbe Weiß mit einem normalen Füllmodus verwenden. Geben Sie dem Schatten eine Entfernung von 2 Pixeln und eine Größe von 1 Pixel. Durch diese Einstellungen wird der Schatten am unteren Ende des Typs als Hervorhebung angezeigt, wodurch dem Typ mehr Tiefe verliehen wird und der innere Schatten verstärkt wird.
Schritt 8
Wählen Sie das Textwerkzeug erneut aus, und erstellen Sie ein Textfeld, das die Breite der rechten Seitenleiste ausfüllt, die wir mit Hilfslinien markiert haben. Fügen Sie eine Reihe von Kategorien unter der Kategorieüberschrift ein, wie unten dargestellt:
Wählen Sie die Kategorieüberschrift und ändern Sie die Schriftart zu einer Ihrer Wahl. Ich habe Minion Pro benutzt. Experimentieren Sie mit Unterschriften (fett, kursiv etc.) und Punktgrößen.
Ändern Sie die Schriftart für die Kategorien ("Nachrichten", "Tage", "Fotografie" usw.) Ich habe Myriad Pro verwendet. Verringern Sie die Punktgröße des Typs und passen Sie den Zeilenabstand (dh den Abstand zwischen den Textzeilen) so an, dass die obere Zeile niedriger liegt als die Standardzeile.
Kopieren Sie die erste Überschrift und die Links und fügen Sie sie im selben Textfeld ein. Ändern Sie die Überschrift und die Kategorien. Ich habe die Überschriften "Meine Projekte" und "Meine Freunde" verwendet. Verwenden Sie natürlich, was für Ihre Website relevant ist.
Schritt 9
Wir werden jetzt den Text in der rechten Seitenleiste ein wenig ansprechender gestalten. Wählen Sie den Text für Unterkategorien (also nicht die Überschriften) und ändern Sie die Farbe von Schwarz zu einem Dunkelgrau. Ich habe # 333333 benutzt. OK klicken.
Klicken Sie mit der rechten Maustaste auf die Textebene und wählen Sie "Fülloptionen". Wenden Sie einen weißen Schlagschatten mit einem normalen Füllmodus an. Ändern Sie den Winkel auf 120 ° und den Abstand und die Größe auf 1 Pixel. Lassen Sie alles andere auf 0 Pixel eingestellt. Dadurch wird ein Highlight am unteren Rand des Textes hinzugefügt, genau wie bei der Überschrift.
Schritt 10
Wählen Sie das Linienwerkzeug und zeichnen Sie bei gedrückter Umschalttaste eine Linie unter der Überschrift "Kategorien".
Klicken Sie mit der rechten Maustaste auf den Linienlayer und wählen Sie "Überblendungsoptionen". Wenden Sie einen weißen Schlagschatten mit einem normalen Überblendungsmodus an. Stellen Sie den Winkel auf 90 ° und den Abstand zu 1 Pixel ein. Setzen Sie alles andere auf 0 Pixel.
Duplizieren Sie die Linienebene und positionieren Sie sie unter jeder der Überschriften.
Schritt 11
Wenn Sie die gleiche Anzahl an Überschriften wie ich haben, sollten Sie drei Zeilenebenen haben. Wählen Sie alle aus und duplizieren Sie sie. Wenn die drei Linienebenen noch ausgewählt sind, schieben Sie sie um 10 Pixel nach unten, indem Sie die Umschalttaste gedrückt halten und die Abwärtstaste einmal drücken. Verringern Sie die Deckkraft Ihrer neueren Zeilenebenen auf 25%, damit etwas wie folgt angezeigt wird:
Schritt 12
Besorgen Sie sich das Werkzeug "Rechteckform" und zeichnen Sie ein Rechteck, das dem folgenden ähnelt. Machen Sie das Rechteck genau 570 Pixel breit. Dies ermöglicht eine 10-Pixel-Lücke zwischen der linken Seitenleiste und der Kante des neuen Rechtecks und eine 20-Pixel-Lücke zwischen der rechten Seitenleiste und der Kante des neuen Rechtecks, wie im folgenden Screenshot zu sehen ist:
Schritt 13
Wählen Sie das Werkzeug Rechteckform erneut aus, und erstellen Sie ein viel kleineres graues Rechteck wie das folgende. Positionieren Sie es in der oberen rechten Ecke des großen Rechtecks, das um 10 Pixel vom großen Rechteck versetzt ist. Positionieren Sie die Form 30 Pixel vom oberen Rand des Rechtecks entfernt.
Schritt 14
Duplizieren Sie die Textebene in der rechten Seitenleiste und verschieben Sie die Ebene des duplizierten Typs mit der Umschalttaste und der Cursor-Taste über den Hauptinhaltsbereich. Machen Sie dasselbe mit den zwei Linienebenen für Ihre Überschrift "Kategorien".
Wählen Sie das Type-Werkzeug und klicken Sie auf Ihren duplizierten Typ-Layer. Entfernen Sie den gesamten Text in dem Feld, und ändern Sie die Überschrift in etwas geeigneteres. Ich habe hier nur einen Dummy-Text verwendet: "Das hier heißt ein Titel."
Schritt 15
Gehen Sie zu Datei → Platzieren und suchen Sie ein Foto, das Sie als Platzhalter in das Dokument einfügen möchten. Die Verwendung von echten Bildern ist immer am besten, weil sie das Modell realistischer und attraktiver erscheinen lassen. Ich benutzte eine Foto von meiner Schwester .
Gehe zu Bearbeiten → Freie Transformation, um die Größe des Fotos zu reduzieren und es an der richtigen Stelle zu positionieren. Machen Sie es insgesamt 20 Pixel kürzer in der Breite und Höhe, so dass es gut in das schwarze Rechteck passt, so:
Schritt 16
Öffnen Sie die Optionen zum Überblenden für das große schwarze Rechteck. Wenden Sie eine weiße Farbüberlagerung und einen Schlagschatten mit einer Deckkraft von 10% und einer Größe von 3 Pixeln an.
Schritt 17
Wählen Sie erneut das Rechteckform-Werkzeug und zeichnen Sie eine lange Form unterhalb der weißen Fotohintergrundform. Stellen Sie sicher, dass es dieselbe Breite hat. Fülle es mit einem hellen Grau.
Öffnen Sie die Optionen zum Überblenden für das neue graue Rechteck, und wenden Sie einen Schlagschatten an. Stellen Sie die Farbe bei einem normalen Füllmodus auf Weiß, die Deckkraft auf 100% und die Entfernung auf 1 Pixel ein. Lassen Sie alles andere auf 0 Pixel eingestellt.
Wenden Sie auch einen inneren Schatten mit der Farbe Schwarz mit einer Deckkraft von 10% an. Ändern Sie die Größe auf 13 Pixel und lassen Sie alles andere auf 0 Pixel eingestellt. Diese zwei Ebenen-Stile lassen die neue Form wie im Hintergrund aussehen, wie unsere Überschriften-Typografie:
Schritt 18
Gehen Sie zur Seitenleiste und laden Sie sich einige sich wiederholende Holztexturen herunter. Ich benutze ein Stellen Sie von GraphicRiver ein Dazu gehören drei verschiedene Holztexturen: hell, mittel und dunkel.
Sobald Sie die Muster in Photoshop installiert haben (indem Sie jedes Bild öffnen und es als Muster definieren), wählen Sie die Seitenleiste in Ihrem Photoshop-Dokument. Gehe zu Ebene → Neue Füllebene → Muster. Wählen Sie eine Ihrer Holztexturen aus (ich habe die Medium-Version ausgewählt) und klicken Sie auf OK. Wenn Sie zuerst die Seitenleiste auswählen, sollte das Muster nur diesen Bereich ausfüllen.
Klicken Sie mit der rechten Maustaste auf die Musterebene und wählen Sie "Überblendungsoptionen". Wenden Sie eine Überlagerung an, die von schwarz über transparent bis schwarz reicht:
Ändern Sie die Deckkraft der Verlaufsüberlagerung auf 10% und geben Sie einen Winkel von 0 ° ein. Dies fügt der Seitenleiste einen subtilen Schatten hinzu und lässt sie etwas realistischer und weniger flach erscheinen.
Wenden Sie außerdem einen Schlagschatten auf die Seitenleiste an. Verringern Sie die Deckkraft auf 30% und ändern Sie den Winkel auf 180 °. Ändern Sie den Abstand zu 1 Pixel und die Größe zu 5 Pixel, alles andere auf 0 Pixel festgelegt. Dies fügt der Seitenleiste einen kleinen und feinen Schatten hinzu.
Schritt 19
Öffnen Sie die "Überblendungsoptionen" für das Kreisportrait, das wir am Anfang dieses Tutorials erstellt haben. Wenden Sie einen weißen Schlagschatten mit den folgenden Einstellungen an:
Übernehmen Sie einen inneren Schatten mit den folgenden Einstellungen. Dadurch sieht das Kreisportrait so aus, als ob es in den Baum platziert wäre, anstatt nur darauf zu sitzen.
Schritt 20
Dupliziere die Titelebene im Hauptinhalt. Positionieren Sie es in der Seitenleiste neu und ändern Sie den Text in "Über mich". Positionieren Sie die zwei Zeilen unter der Überschrift neu und ändern Sie die Größe.
Öffnen Sie die "Überblendungsoptionen" für Ihre neue Textebene, und ändern Sie die Schlagschatteneinstellungen wie folgt:
Fügen Sie dem Abschnitt "Über mich" einen Text hinzu, der die gleiche Schrift und Größe verwendet wie im Text der rechten Seitenleiste. Öffnen Sie die "Überblendungsoptionen" für diesen neuen Text und klicken Sie auf die Registerkarte "Äußeres Glühen", um ein äußeres Glühen anzuwenden; Ändern Sie die Deckkraft auf 30%, die Farbe auf Weiß und die Größe auf 18 Pixel.
Dies macht unseren Text besser lesbar gegen den hölzernen Hintergrund.
Spielen Sie mit der Schriftgröße herum, um den Text einfacher zu scannen.
Schritt 21
Nach einigen Experimenten entschied ich, dass die gesamte Seitenleiste in der dunkleren der drei oben genannten Texturen viel besser aussah. Ich habe das Seitenleistenmuster und die Farben des Textes geändert. Benutze die Techniken, die du bereits gelernt hast.
Hier sieht mein Design so aus:
Schritt 22
Wie viel Sie auch geplant haben, Sie müssen während des Designprozesses Änderungen vornehmen. Als ich das Design als Ganzes betrachtete (und nicht stückweise), kam ich zu dem Schluss, dass 10 Pixel zwischen den Seitenleisten und dem Hauptinhaltsbereich nicht annähernd genug waren.
Verwenden Sie die Umschalttaste und die Cursor-Tastenkombination, um den Inhalt zu verschieben, sodass die beiden Lücken 40 anstatt 10 Pixel sind. Dadurch wird das Design benutzerfreundlicher und attraktiver.
Schritt 23
Ich habe mich auch entschieden, den Stil der Überschrift des Themas zu ändern.
Ändern Sie die Farbe (mit einer Farbüberlagerung im Fenster "Überblendungsoptionen") zu einer Farbe, die aus dem Kreis-Hochformat ausgewählt wurde. Ich wählte ein dunkelgrünes Blau.
Ich entfernte auch den inneren Schatten und änderte die Schlagschatten-Einstellungen, so dass es so aussah, als würde die Kopfzeile über dem Hintergrund sitzen und nicht darin gesetzt werden.
Schritt 24
Wenn Sie zum Hauptinhaltsbanner (dh zum zuvor erstellten Rechteck, das sich in der oberen rechten Ecke des Bildbereichs des Hauptinhalts befindet) wechseln, wählen Sie das Rechteck aus, indem Sie bei gedrückter Befehlstaste auf die Miniaturansicht der Ebene klicken.
Gehe zu Ebene → Neue Füllebene → Muster und wähle die gleiche Textur wie für die Seitenleiste.
Klicken Sie mit der rechten Maustaste auf die Musterfüllungsebene und wählen Sie die Option "Ebene rasterisieren". Verwenden Sie die Werkzeuge Ausweichen und Brennen, um links und oben auf der Form und den Schatten rechts und unten der Form Glanzlichter hinzuzufügen.
Dies bringt Tiefe und verleiht der Form ein leichtes dreidimensionales Gefühl. Das Nachbelichter-Werkzeug verdunkelt das Bild, während das Dodge-Werkzeug es aufhellt.
Wählen Sie das Polygon-Lasso-Werkzeug aus. Wählen Sie eine Form ähnlich der unten stehenden aus und füllen Sie sie mit einem dunklen Braun, das aus Ihrer Textur ausgewählt wurde.
Wählen Sie mit dem rechteckigen Auswahlwerkzeug die Bereiche in der neuen Form aus, die Sie nicht benötigen, und drücken Sie die Entf-Taste, um sie zu entfernen. Sie sollten mit etwas ähnlichem enden:
Schritt 25
Schnappen Sie sich unser eigenes exklusives Icon-Set "Reflection" genannt. Wir werden einige dieser Icons in unserem Design verwenden.
Fügen Sie die benötigten Symbole in das Dokument ein, indem Sie zu Datei → Ablage gehen. Ich wählte die Kamera, Herz, neu laden, bearbeiten und Uhr Symbole, die als mein Foto, wie, Reblog, Notizen und Zeit Symbole im Thema dienen.
Schritt 26
Wählen Sie das Kamerasymbol und ändern Sie die Größe. Positionieren Sie es in der Post-Typ-Leiste, die wir gerade erstellt haben. Wenden Sie einen inneren Schatten an und werfen Sie einen Schatten darauf. Verwenden Sie dabei ähnliche Einstellungen wie in diesem Tutorial.
Fügen Sie der Post-Typleiste eine Typografie hinzu. Ich habe das gleiche Reklame-Skript verwendet, das wir in der Überschrift verwendet haben, und dieselben Mischoptionen, die wir für die Überschriften der linken Seitenleiste verwendet haben.
Schritt 27
Wählen Sie die anderen vier Symbolebenen aus. Klicken Sie mit der rechten Maustaste und wählen Sie "Layer rasterisieren", um sie von intelligenten Objekten zu Pixelobjekten zu machen.
Verwenden Sie das rechteckige Auswahlrechteck, um alle Reflexionen des Symbols auszuwählen.
Drücken Sie die Entf-Taste auf jeder der Icon-Ebenen, um ihre Reflexion zu entfernen.
Schritt 28
Wählen Sie alle vier Symbolebenen erneut aus. Gehe zu Bearbeiten → Freie Transformation und halte die Umschalttaste gedrückt, um die Symbole proportional zu halten. Reduziere ihre Größe und positioniere sie in der Leiste unter dem Hauptinhaltsbereich, den wir zuvor erstellt haben.
Platzieren Sie die Symbole gleichmäßig mit den Cursortasten.
Schritt 29
Klicken Sie mit der rechten Maustaste auf die Ebene des Herzsymbols und wählen Sie im Menü die Option "Fülloptionen". Ändern Sie die Farbe mithilfe einer Farbüberlagerung in hellgrau und wenden Sie einen inneren Schatten an, indem Sie die folgenden Einstellungen verwenden:
Wenden Sie nun einen Schlagschatten an und verwenden Sie diese Einstellungen:
Sobald die Einstellungen auf die Herzsymbolebene angewendet wurden, klicken Sie mit der rechten Maustaste und wählen Sie "Ebenenstile kopieren". Wählen Sie alle vier Symbole erneut aus, klicken Sie mit der rechten Maustaste und wählen Sie "Ebenenstile einfügen". Alle Symbole in dieser Leiste sollten jetzt die gleicher Effekt.
Schritt 30
Wählen Sie das Schriftarten-Werkzeug aus und erstellen Sie ein kleines Textfeld neben dem Herzsymbol. Geben Sie "Gefällt mir diesen Beitrag" ein. Wenden Sie einen inneren Schatten an und werfen Sie den Schatten mit ähnlichen Einstellungen wie in diesem Tutorial.
Wiederholen Sie den vorherigen Schritt für die verbleibenden Symbole, indem Sie die folgenden Ausdrücke verwenden: "Diesen Beitrag rebloggen", "1052 Notizen" und "Gesendet am 19/03/2011". Achten Sie darauf, dass Sie den gleichen Ebenenstil auf jede Textebene kopieren und einfügen.
Sie können auch einige der Symbole mit dem neuen Text neu positionieren und sicherstellen, dass die Lücke zwischen dem Text und den Symbolen konsistent ist. Aufgrund der unterschiedlichen Textlängen könnte sich dies geändert haben.
Schritt 31
Duplizieren Sie alle Ebenen im Hauptinhaltsbereich und positionieren Sie sie unter dem Original. Ändern Sie das Rechteck für Titel, Bild und Post-Typ. Wie erwähnt, je realistischer das Modell, desto besser.
Schritt 32
Duplizieren Sie die Überschrift und den Text in der Seitenleiste und fügen Sie einige Symbole ein. Ich habe die exzellenten Social-Media-Icons verwendet, die als bekannt sind Buddycons , ein weiteres Set exklusiv für Webdesigner Depot.
Das Endprodukt
Nach einigen weiteren Ausbesserungen (ich entfernte den gezackten, bandartigen Schnitt unten in der Seitenleiste), bin ich fertig! Hier ist unser endgültiges Design, das bereit ist, codiert oder an einen Entwickler geschickt zu werden, um es zu tun.
Dieses Tutorial wurde exklusiv für Webdesigner Depot von erstellt Callum Chapman , ein freiberuflicher User Interface Designer, der unter dem Namen handelt Kreisschachtel kreativ . Callum arbeitet auch an einem Inspirationsgalerie Projekt namens Vinspires.
Möchten Sie ein anderes Tutorial sehen, wie Sie dieses Design in ein voll funktionsfähiges Tumblr-Theme aufteilen und codieren können?