Grundlagen des Portfolio-Designs [2012]

1. Inhalte und Zweck: Hey, alle. Willkommen in der Skillshare Klasse. Ich freue mich, heute mit euch darüber zu sprechen, wie ihr euer Online-Portfolio präsentieren könnt. Ja, ich will nur ein paar Dinge durchgehen, was wir in dieser Klasse abdecken werden. Wir beginnen mit dem Inhalt und dem Zweck der Website und dann gehen wir weiter, um wirklich eine Plattform zu wählen, die am besten für Sie funktioniert. Dann sprechen Sie über das Design der Website und wie es aussieht, und wickeln Sie es mit einigen letzten Schliff einschließlich Ihrer Registrierungs-Domain-Namen und diese Art von Sache. Auch nur um darüber zu gehen, dies ist eine Online-Klasse, so wie Sie gehen, können Sie an Ihrem Projekt arbeiten und es in die Projektgalerie hochladen , um Feedback von Ihren Kommilitonen zu erhalten. Dann sehen Sie sich diese Videos an und gehen durch den Projektführer, in dem alle Schritte für Sie detailliert beschrieben werden. Ja, nur ein bisschen über mich selbst. Ich arbeite hier bei Skillshare als Dekan der School of Design. Ich bin wirklich aufgeregt, diesen Kurs zu unterrichten. Es ist etwas, mit dem ich seit einer Weile Freunden helfe und ich freue mich, heute alles mit euch teilen zu können. Die erste Einheit ist Inhalt und Zweck. Hier werden wir wirklich über den Inhalt für die Website nachdenken. Das ist wichtig, bevor Sie in das Design der Website einsteigen , weil es Ihnen hilft, diese Entscheidungen später zu treffen. Deswegen nähern wir uns dem hier von Anfang an an. Der erste Schritt ist wirklich, Ziele zu setzen und darüber nachzudenken , was Sie mit Ihrer Portfolio-Website erreichen wollen. Versuchen Sie, einen Job zu bekommen? Sie sind auf der Suche nach einem Praktikum? Sind Sie hier, um neue freiberufliche Kunden zu finden, und so etwas. Wofür wirst du es dann benutzen? Das sind Dinge, die man im Hinterkopf behalten muss. Ich denke, das Beste, was zu tun ist, ist einige dieser Gedanken aufzuschreiben. Sie können sie beim Durchlaufen des Projekts referenzieren. Der zweite Schritt besteht darin, die tatsächlichen Projekte auszuwählen , die Sie auf Ihrer Portfolio-Website einschließen werden. Ein paar Dinge, die Sie im Auge behalten sollten, sind die Projekte zu kuratieren, die Sie einschließen werden. Haben Sie nicht das Gefühl, dass Sie alles, was Sie im Laufe der Jahre gemacht haben, enthalten müssen, aber wirklich einige spezifische Projekte auswählen, die eine Geschichte über sich selbst und Ihre Arbeit erzählen können und die mit den Zielen, die Sie für die Website festgelegt haben, übereinstimmen. Der nächste Schritt besteht darin, Bilder zu sammeln und den Inhalt für die Website zu kopieren. Dinge, über die Sie hier nachdenken müssen, sind immer die besten Bilder für die Website. Es könnte sein, sie machen Motion Graphics oder vielleicht, dass Sie Druckdesign, in diesem Fall möchten Sie vielleicht zu fotografieren, die in den verschiedenen Einstellungen arbeiten , die am besten für sie funktioniert. Dann auch viele Portfolio-Websites, Ich denke, wirklich konzentrieren sich auf die Bilder, aber es ist auch wichtig, einige Kontext der Arbeit zu bekommen. Sie können dies tun, indem Sie einige Beschreibungen schreiben, um mit jedem der Projekte zu gehen. Ich denke, das ist eine wirklich nette Note, weil es jedem erlaubt , der Ihre Website besucht, wirklich ein Gefühl davon zu bekommen, worum es bei dem Projekt ging. Sie können auch über den Prozess sprechen, den Sie durchgemacht haben, einige der Probleme, die Sie gelöst haben, und einige weitere Details zu diesem Projekt geben. Dann möchten Sie auch darüber nachdenken, zusätzliche Seiten hinzuzufügen , die Sie auf der Website enthalten werden. Dies kann Dinge wie Ihre About Seite enthalten. Es gibt auch andere Arten von Seiten Sie können eine Kontaktseite oder eine Seite „Dienste“ ausführen, auf der Sie die verschiedenen Arten von Jobs auflisten können, an denen Sie arbeiten möchten. Diese können dazu beitragen, ein vollständigeres Bild zusätzlich zu den Kerninhalt Ihrer Website zu malen, was wirklich die Projekte ist. Schließlich werden Sie für diese Einheit etwas Inspiration sammeln wollen. Sie können sich einige Beispiele online ansehen. Denken Sie darüber nach, wer der Künstler oder Designer oder Fotografen ist, die Sie bewundern, und schauen Sie sich ihre Websites an und sehen Sie, wie sie tatsächlich ihre Arbeit online präsentieren. Sammeln Sie diese Inspiration und machen Sie einige Mood Boards werden Ihnen helfen, wenn Sie vorwärts in den Rest der Klasse gehen, so dass Sie ein Gefühl bekommen, was sonst noch online ist. Als nächstes werden wir im nächsten Video Plattformen und Tools machen und freuen uns darauf. Danke. 2. Plattformen und Tools: Willkommen zurück in der zweiten Einheit der Skillshare Klasse. In dieser Einheit werden wir Plattformen und Werkzeuge abdecken. Wir decken vier Kernplattformen ab, die Ihnen beim Aufbau Ihrer Portfolio-Websites helfen. Um dies zu denken ist, dass es Ihnen erlaubt, abzuspringen und wirklich auf Ihrer Website zu beginnen, anstatt es von Grund auf neu zu bauen. Diese Plattformen bieten eine Backend-Schnittstelle, die wirklich einfach zu bedienen ist , mit der Sie Ihre Website aktualisieren und bearbeiten können. Es gibt Ihnen die Tools, die Sie brauchen, um Ihre Website neu zu erstellen und sich auf den Inhalt zu konzentrieren und nicht so sehr viel benutzerdefinierten Code zu schreiben. Der erste Schritt dieser Einheit besteht darin, eine Plattform auszuwählen. Es gibt vier, die wir behandeln werden, aber es gibt auch viele andere, die ich im Projektleitfaden skizziert habe. Fühlen Sie sich frei, andere zu teilen, die Sie vielleicht auch kennen. Der erste ist Cargo. Das ist diejenige, die ich seit Jahren benutze. Ein paar Details über Cargo ist, dass es $66 pro Jahr ist, was ziemlich gut ist. Hat auch erweiterte CSS- und HTML-Bearbeitung. Wenn du wirklich reinkommen willst und unheimlich werden willst, kannst du das tun. Die zweite ist Behance. Behance hat seinen normalen Netzwerkstandort, aber sie haben auch ein Produkt namens ProSite. Auf diese Weise können Sie benutzerdefinierte Portfolio-Websites erstellen , auf denen kein Behance-Branding vorhanden ist, sodass es genauso aussieht wie Ihre eigene Website. Ein paar Details über Behance ist, dass es $11 im Monat ist. Es ist wirklich schön, weil Sie immer noch ein Profil auf dem größeren Behance-Netzwerk haben. Sie erhalten, dass Zugang zu all den anderen Funktionen, die sie gebaut haben, und auch diese Gemeinschaft gibt es wirklich schön. Der dritte ist Virb. Virb ist schon eine Weile da. Es sind $10 im Monat. Virb ist nett, weil es Bloggen direkt in es integriert hat, und Sie können Ihren Tumblr Feed und solche Dinge eingeben. Es ist auch mobil reaktionsschnell, so dass es gut auf einem Smartphone oder einem Tablet-Gerät funktioniert. Der vierte ist Squarespace. Squarespace gibt es schon eine Weile. Es ist als Drag & Drop Tool bekannt, so dass Sie Ihre Website mit dieser intuitiven Benutzeroberfläche erstellen können. Es ist auch reaktionsschnell. Es hat auch große E-Commerce-Funktionen. Wenn Sie ein Künstler sind, der Drucke oder Fotografien oder Stücke Ihrer Arbeit verkaufen möchte, haben sie wirklich große Integration dafür. Dieser Bereich reicht von $8 bis $16 im Monat. Das nächste, was Sie tun möchten, ist, sich für ein Konto anzumelden. Sie können jede dieser Websites überprüfen und wirklich wählen, welche für Sie gut ist. Jeder hat eine lange Liste der verschiedenen Funktionen. Die meisten von ihnen haben einige gemeinsame Kernfunktionen sind die gleichen und es gibt einige spezifischere Dinge, die ich gerade behandelt , die Ihnen bei der Auswahl helfen könnten, welche für Ihre Website am besten ist. Denken Sie daran, dass dies tatsächlich bezahlte Websites sind, aber wieder gibt es einige andere, die im Projekt aufgeführt sind und sie sind kostenlos. Der dritte Schritt besteht darin, Ihre Inhalte hochzuladen. Gehen Sie in der von Ihnen gewählten Plattform weiter, laden Sie Ihre Projekte und Ihre Seiten hoch, und machen Sie sich keine Sorgen darüber, wie es zu diesem Zeitpunkt aussieht. Das ist nicht etwas, worüber man an dieser Stelle wirklich nachdenken muss. Es ist nur wichtig, den Inhalt auf der Website zu bekommen und zu sehen, wie es sich bei allen Projekten und Seiten anfühlt. Als nächstes werden wir tatsächlich in das Design der Website und die visuellen Aspekte davon eingehen. Darauf freue ich mich. Danke. 3. Design und Themen: Hallo, willkommen zurück zu Einheit 3 dieser Skillshare Klasse. In dieser Einheit werden wir Design und Themen für Ihre Portfolio-Website abdecken. Wir können wirklich verstehen, wie Ihre Website aussehen und sich anfühlen sollte. Der erste Schritt besteht darin, eine Vorlage auszuwählen. Sie sollten mit einer beginnen, die für den Inhalt und den Zweck Ihrer Website und die Ziele,die Sie zu erreichen versuchen, funktioniert und den Zweck Ihrer Website und die Ziele, , und dann können Sie es von dort aus anpassen. Wählen Sie eine, die Sie auf uns aufbauen können, während wir gehen. Hier sind einige Beispiele, die ich mit Ihnen teilen wollte. Dies ist ein traditionelles Layout, also haben Sie die Spalte auf der linken Seite, die alle Projekte auflistet, und Sie haben auch die entsprechenden Miniaturansichten im Hauptbereich dort. Dies ist eine auf [unhörbar] Ich glaube, und es scrollt links nach rechts, so dass jede Spalte ein anderes Projekt ist. Dieses ist nur ein vollständiges Raster, so dass es keine linke oder rechte Hand Navigation und zeigt Ihnen nur die Thumbnails, so dass Sie sich wirklich auf die Arbeit in diesem konzentrieren. Dies ist eine, die eher ein [unhörbares] Design ist, so dass es diesem Gitter nicht so sehr gehorcht und es den Projekten ermöglicht , herumzuspringen und an verschiedenen Stellen auf der Seite zu sein. Dies sind einige Beispiele für Themen und Vorlagen. Im Projekt habe ich mit den Optionen für alle verschiedenen Themen für jede der Plattformen verknüpft . Der nächste Schritt besteht darin, die Projekt-Miniaturansichten für Ihre Portfolio-Website auszuwählen. Dinge, über die Sie hier nachdenken müssen, ist, wie sie alle zusammenarbeiten und wie, wenn jemand die Website besucht, was sie mit all Ihren Thumbnails dort auf einmal sehen werden. Sie sollten gut definierte Kanten haben, nicht zu detailliert, und dann auch, wenn Sie sie in Photoshop speichern, speichern Sie sie für das Web, so dass die Website schneller geladen wird. Einige sind nett und klein. Hier sind einige Beispiele für Miniaturansichten. Wir sehen, dass die Menschen in den Aufnahmen der verschiedenen Projekte ein Ende machen. Sie zoomen auf einige Details und füllen das Thumbnail schön aus. Sie können auch wie den Projekttitel in die Miniaturansicht einfügen. Der letzte Schritt besteht darin, Ihre persönliche Marke hinzuzufügen Wenn Sie also eine haben, können Sie sie in der Kopfzeile hinzufügen. Alle vier Plattformen, über die wir zuvor gesprochen haben, haben die Möglichkeit für Sie, benutzerdefinierte Kopfzeile oder ein benutzerdefiniertes Logo für Ihre Website hinzuzufügen, und das ist eine großartige Möglichkeit, persönliche Note hinzuzufügen. Aber wenn Sie das an dieser Stelle nicht haben, überhaupt keine Sorgen. Fügen Sie einfach Ihren Namen oder den Namen Ihrer Website hinzu und es wird gut sein, zu gehen. Hier sind einige Beispiele dafür. Menschen haben unterschiedliche Logos oder verschiedene Stile, die sie in ihrem Branding verwendet haben, einige handschriftliche, persönliche Logos dort. Whitney Dail an der Unterseite hat ihr Aussehen und Gefühl mit ihrer unterschiedlichen Typografie und der Rest der Seite hat die Thumbnails darunter. Es gibt einige Dinge zu beachten, wenn Sie Ihre Kopfzeilen entwerfen. Als Nächstes haben wir den letzten Schliff. Wir werden einige technische Dinge behandeln und die Portfolio-Website abschließen. Danke. 4. Letzte Schliffe: Hey, alle, willkommen zurück in der Skillshare Klasse. Das ist Einheit 4, es ist die letzte der Klasse. Es geht um Finishing Touches, ein paar verschiedene Dinge, die Sie tun können, um Ihre Portfolio-Website bereit zu machen, sie mit allen zu teilen und wirklich schön zu verpacken. Das erste, was zu beachten ist, sind Domain-Namen. Es gibt einen anderen Ansatz, dies für jede der Plattformen zu tun, und Sie können die Anleitungen finden , die sehr spezifisch für jede der Plattformen sind , und den Projektleitfaden für diese Klasse. Dies ist eine tolle Ergänzung für Ihre persönliche Marke. Du kannst deinen eigenen benutzerdefinierten Domainnamen auf deiner Visitenkarte oder deinem Twitter-Profil setzen und das auch wirklich tun. Das sind Domain-Namen. Das zweite, was zu beachten ist, wie Sie Ihre Portfolio-Website bewerben und teilen , jetzt, wo Sie alles bereit haben, zu gehen. Sie können dies tun, indem Sie es zu Ihrer E-Mail-Signatur hinzufügen. Wenn wir eine E-Mail senden, ist sie genau da unten und die Leute können Ihre Arbeit leicht finden und Ihr Portfolio sehen. Sie können auch auf Ihrem Social-Media-Profil, auf Ihrem Facebook oder Ihrem Instagram-Feed hinzufügen und Personen senden, um Ihre Arbeit als auch zu sehen. Das dritte, was zu beachten ist, sind alle Add-Ons, die Sie tun möchten. Die meisten dieser Plattformen, wie das Hinzufügen eines Blogs oder Online-Shops, so dass Sie weiterhin Geschichten darüber erzählen, woran Sie arbeiten oder einige Dinge teilen, die Sie kaufen können. Das ist ein Weg, um Ihre Portfolio-Website zu erstellen und sie frisch zu halten, während Sie gehen. Die vierte Sache zu beachten ist, dass, stellen Sie sicher, dass Sie Ihre Portfolio-Website aktualisieren, jetzt, wo Sie alles gebaut haben. Wann immer Sie Ihr Projekt machen oder Sie ein neues Stück mit allen teilen können, zögern Sie nicht, es auf Ihrer Portfolio-Website zu posten und dann teilen, dass Sie es tatsächlich aktualisiert haben. Das kann dazu führen, dass Leute zurückkommen und überprüfen, woran du arbeitest. Das schließt es so ziemlich ein. Vielen Dank, dass Sie diese Klasse besucht haben. Es war aufregend, euch alle hier zu haben. Stellen Sie sicher, dass Sie Ihre Projekte teilen, um Feedback von allen anderen in der Klasse zu erhalten. Dann hinterlassen Sie bitte auch ein paar Rückmeldungen zum Kurs. Ich würde gerne hören, was Sie davon gedacht haben. Vielen Dank.