Arbeiten mit Bildern in UI-Design-Projekten

1. Kurs-Einführung: Hey Designer und mein Name ist Alex und willkommen zu dieser Skillshare Klasse über die Arbeit mit Bildern in Ihren UI-Design-Projekten. Ich bin Gründer von Web Doughnut, wo ich oder 500 Design-Produkte erstellt. Ich bin auch Lehrer und bisher habe ich mehr als 20 Kurse und eine Hälfte erstellt, mehr als 40000 Studenten in diesen Kursen eingeschrieben. In dieser Klasse werden wir darüber sprechen, was einige der besten Möglichkeiten für Sie als UI-Designer sind , Bilder in Ihrem Projekt zu verwenden. Wir werden darüber sprechen, warum Bilder wichtig sind und was Sie beachten sollten , wenn Sie auswählen, welche Bilder Sie in Ihren Projekten verwenden möchten. Wir werden auch besprechen, wie Sie Bilder als UI-Designer finden und wie Sie sie in Ihre Projekte integrieren können. Wir werden besprechen, wie einige Bilder von externen Fotografen aufgenommen werden können und wie der Kunde diese Bilder an Sie liefern kann. Und dann werden wir zusätzliche Erkenntnisse wie kostenlose und Premium-Bilder vergleichen. Was sind die Unterschiede zwischen ihnen und was sind einige Unterschiede in der Lizenzierung von denen kostenlos in Premium-Bildern. Wir werden auch die Wichtigkeit von Bildsätzen diskutieren, wie man Bildsätze auswählt und wie man mit ihnen arbeitet. Und dann werden wir besprechen, wie einfach es für Sie ist, Bilder in verschiedenen Nischen zu finden. Warum sind verschiedene Nischen wichtig Ihre Bilder für Ihre UI-Design-Projekte zu finden und wie Sie diese Bilder finden und in Ihre Designprojekte integrieren können ? Dann werden wir über die Bildoptimierung auf Mac und Windows sprechen, warum es wichtig ist und wie Sie mit diesen Image-Optimierungen fortfahren können. Wie sie Ihnen bei Ihrer Arbeit helfen werden und wie sie Ihnen bei der Arbeit mit Entwicklern helfen werden und wie sie Ihre Geschwindigkeit bei der Arbeit mit Entwicklern verbessern und vor allem bei der Arbeit mit diesen Design-Tools wie Adobe XD . Schließlich werden wir die Benennungsstruktur diskutieren, warum es wichtig ist und wie Sie wählen können, mit Benennungsstrukturen zu arbeiten , die für Sie und Ihre Entwickler funktionieren. Ihr Klassenprojekt für diese Klasse ist es, Bilder aus verschiedenen Nischen zu wählen. Ich überlasse es Ihnen, Bilder zu wählen, die Sie wollen. Diese Bilder können entweder kostenlos oder Premium sein. Es liegt alles an dir. Und nur um diese Bilder in einem Dokument zusammenzufügen, und Sie können ein Team auswählen und dies weiter in Skillshare Klasse Projektvideo erklären. Und ich werde wirklich gerne, dass du das als JPEG speicherst und es in das Klassenprojekt hochlädst, damit ich und andere Schüler sehen kann. Und ich bin wirklich aufgeregt zu sehen, was ihr euch einfallen könnt. Ich bin wirklich aufgeregt, diese Tipps und Tricks mit Ihnen zu teilen. Und ich freue mich darauf, Sie im Unterricht zu sehen. 2. Warum Bilder wichtig: Weißt du, was sie sagen, das Bild sagt tausend Worte. Nun, es ist die gleiche Geschichte in Gemälden wie im Design, vor allem im Grafikdesign, aber das gleiche kann in Webdesign und AB-Design gesagt werden. Die Auswahl der richtigen Bilder kann also das Tempo bestimmen , in dem die Zuschauer Ihr Projekt betrachten, egal ob es sich um ein App-Projekt oder unser Website-Design-Projekt handelt. Es kann auch den Ton bestimmen, bei dem Sie mit Ihren Besuchern sprechen. So kann das entweder ernst oder lustig, spielerisch sein. Es kann auch das Tempo bestimmen, in dem Ihre Zuschauer sich Ihr Projekt ansehen können. Also, was das bedeutet, ist, kleinere Bilder zu verwenden, werden größere Bilder zu verwenden. Werden Sie Vollbildbilder für Bilder mit Breite und vieles mehr verwenden? Sie werden auch bestimmen, wie spielerisch oder ernst oder Website ist. Und es werden auch die Farben, die Sie gehen, um es Ihr Design zu verwenden, zu bestimmen, weil der Ton Ihrer Bilder wird wirklich bestimmen, dass. Denn wenn Sie zum Beispiel wirklich dunkle Bilder verwenden , dann werden Sie einige Farben verwenden, die viel besser zu diesen dunklen Bildern kontrastieren. Oder wenn Sie wirklich helle und luftige Bilder verwenden, Dan, werden Sie das kontrastieren, indem Sie etwas viel dunkleres verwenden. Zum Beispiel entweder ein dunkelschwarz, dunkelgrau oder dunkelgrün oder dunkelgrün oder so etwas. So sind Bilder wirklich der Schlüsselfaktor bei der Erstellung Ihrer Designs und die Auswahl der richtigen Bilder für Ihre Entwürfe wird Ihr Design zu machen oder zu brechen. 3. 3 Arten von project: Wenn es um Projekt-Bilder geht, gibt es wirklich drei Haupttypen. Nummer eins sind Bilder, die vom Fotografen abgesteckt werden. Dies sind Bilder, die Ihr Kunde bereits hat, an unseren Premium-Fotografen mitgenommen , der diese Bilder in Sets aufgenommen und wirklich die ganze Geschichte für Ihren Kunden erstellt und diese Bilder dann an Ihren Kunden geliefert hat Sets aufgenommen und wirklich die ganze Geschichte für Ihren Kunden erstellt . Und dann wird Ihr Kunde Ihnen diese Bilder liefern und Sie werden sie wiederum in Ihren Entwürfen verwenden. Zwei ist freie Bilder. Das sind also die Bilder, die Sie normalerweise auf Websites wie Unsplash oder Pixabay finden. Und diese Bilder hier wirklich ein großer Fehler und diese Vielfalt. Das bedeutet also, dass Sie ein großartiges Bild von einem großartigen Fotografen finden können. Und das ist es im Grunde. Sie können also kein anderes Bild finden, zum Beispiel ein Modell in einer anderen Pose oder einen Sonnenuntergang aus einem anderen Blickwinkel oder eine Stadtstraße aus einem anderen Blickwinkel. Sie können sie also nicht finden. Und in der Regel sind diese Bilder wirklich nicht so große Qualität. Normalerweise gibt es so etwas wie 1920 mal 1080, also Full HD oder mindestens 2k in der Größe. Und schließlich, Nummer 3, unsere Premium-Sets. Jetzt sind dies die Websites, die Sie online finden können. In der Regel verwende ich gerne Envato Elemente und ihre eigene Website 2020, was bedeutet, dass sie über 50 Millionen Bilder zur Auswahl haben. Und was das bedeutet, ist, dass diese Premium-Fotografen Szenen schaffen. Stellen Sie sich zum Beispiel vor, im Büro gesehen und dann setzen sie diese Szene. Sie stellen das Büro ein. Sie zahlen für die Modelle. Und sie nehmen Hunderte von verschiedenen Bildern aus allen verschiedenen Blickwinkeln von mit verschiedenen Modellen, die verschiedene Dinge tun. Und der Hauptvorteil dieser Bilder ist, dass sie alle in einer kontrollierten Umgebung von einem einzigen Fotografen unter einer einzigen Lichtquelle mit den gleichen Modellen aufgenommen einer kontrollierten Umgebung von einem einzigen Fotografen unter werden, mit demselben Team im selben Raum. Also verstehst du die Idee. Diese Bilder können einfach in Ihren Projekten verwendet werden. Und zum Beispiel, wenn Sie eine leichte Änderung mit beispielsweise der Helligkeit vornehmen müssen , dann können Sie dies in etwas wie Adobe Lightroom tun. Und dann können Sie alle diese Bilder nehmen, die Sie das Vier-Jahres-Projekt herunterladen, können Sie einen einzigen Tweet machen, zum Beispiel, um die Helligkeit oder die Fettleibigkeit, oder die Vignettierung oder was auch immer Sie mit diesem ersten Bild tun. Und Sie möchten die gleiche Änderung auf alle Ihre Bilder anwenden. Zum Beispiel haben Sie den Satz von 50 verschiedenen Bildern heruntergeladen. Dann können Sie diese erste Änderung einfach auf das erste Bild anwenden und dann anwenden durch viele Ihrer anderen Bilder aus der gleichen Sammlung. Sie können diese Änderungen einfach synchronisieren. Und zum Beispiel, Adobe Lightroom wird diese Änderungen anwenden. Sie müssen Lightroom nicht verwenden. Ich benutze es wirklich gerne, weil ich ein Adobe-Benutzer bin. Ich benutze Adobe XD, ich benutze Adobe Photoshop, ich benutze Premier und ich benutze natürlich Lightroom für alle meine Bilder. Und ich mochte diese Funktion wirklich, aber sie ist nicht nur in Lightroom. Sie können es in anderen Tools und Software finden, wie es gibt. Achten Sie darauf, danach zu suchen, aber es wird Ihnen eine Menge Zeit sparen. Ob Sie also Client-Images verwenden, müssen Sie vielleicht ein paar Dinge hier und da optimieren. Denn normalerweise machen diese Fotografen fantastische Bilder, aber vielleicht, wenn Sie Website-Design für unseren etwas dunkleren Ton erstellen , sagen wir, dann werden Sie einige dieser Änderungen zusätzlich auf diese Bilder anwenden. Normalerweise lassen Fotografen diese Bilder gerne ziemlich roh. Daher werden Designer diese Änderungen wiederum vornehmen. So zum Beispiel Sättigung, Helligkeit, Kontrast und Sachen wie Schulden zu diesen Bildern. Wieder einmal, wenn Sie kostenlose Bilder verwenden, Todesfälle groß, vor allem für Low-Budget-Kunden, weil sie nicht wirklich kümmern, wie ihr Blog aussieht. Aber wenn Sie mit Kunden arbeiten, die vernünftige Budgets haben, dann können Sie diese Premium-Sets von Bildern ganz einfach von Websites wie Envato Elements in Ihre Arbeit integrieren . Und ich würde wirklich empfehlen, weil Sie Millionen dieser verschiedenen Bilder finden können. Und im Gegenzug werden sie Ihre Arbeit wird viel professioneller aussehen, viel polierter, als wenn Sie nur diese drei Bilder verwenden. 4. So wählst du niche aus: Es gibt viele verschiedene Möglichkeiten für Sie, Nischenbilder zu wählen, aber ich werde Ihnen nur einige Tipps und Techniken geben wie ich es mache und wie ich es in den letzten fast 20 Jahren gemacht habe. Abhängig von der Nische, in der du arbeitest, gibt es einen bestimmten Ton. Also zum Beispiel, wenn Sie eine Website für Herrenanzüge erstellen, zum Beispiel, gibt es eine gute Chance, dass, Das ist eine Premium aussehende Website. Und sie versuchen, einen Ton der Professionalität, einessauberen Designs, einesbestimmten Lebensstils darzustellen sauberen Designs, eines , den diese Anzüge darstellen werden. So offensichtlich werden Sie nicht so etwas wie leuchtend gelb oder eine leuchtend rote Türen und Freude, dass Sie gehen, um mit Sicherheit zu verwenden. Diese hellgraue Farbe ist dunkelgraue Farben, möglicherweise ein Hauch von Blau, vielleicht sogar goldene wenige Stellen, wenn Sie gegen die schwarze Farbe arbeiten. So wird es Ihnen erlauben, sich herauszustellen, offensichtlich weiße Farben. Wenn Sie also Ihre Bilder auswählen, stellen Sie sicher, dass Sie diese Dinge im Auge haben, denn Sie werden Ihre Modelle nicht vor diesem gelben Hintergrund und vor dem Hintergrund wählen , was das Aussehen Ihres Anzugs ruinieren wird. Offensichtlich werden Sie sich an den Ton anpassen. Was das bedeutet, ist, dass Sie nach Modellen suchen, die sich in diesen Positionen befinden, zum Beispiel auf richtig belichteten weißen Hintergründen, weil es viel einfacher für Sie sein wird , diese Bilder in Ihre Arbeit zu integrieren. Auch Modelle vor dem schwarzen Hintergrund, weil Sie so etwas wie ein Bildschirm Fettleibigkeit verwenden können und dann können Sie diesen schwarzen Hintergrund gegen Ihr Design reduzieren. So können Sie Ihr Modell einfach aus Ihrem Hintergrund extrahieren und sich leicht an Ihr Design anpassen. Dies ist also offensichtlich nur eines der Beispiele. Stellen Sie sicher, dass Sie den Ton einstellen und sehen Sie, welchen Ton Ihre Nische ist. Daher werden Sie nach Bildern suchen, die sich in dieser Nische und in dieser Stadt befinden, was wirklich wichtig ist, weil Ihre Besucher sich viel leichter ausrichten werden , wenn sie Dinge sehen, die sie verstehen, eher Dinge, die sie nicht tun. Gehen wir zum Beispiel zurück zu diesem Anzugbeispiel. Stellen Sie sich vor, Sie sind dieser Gentleman, der nach einem Anzug für Ihre Hochzeit sucht , zum Beispiel, für die Hochzeit Ihres Freundes oder so etwas. Und du suchst wirklich hochwertiges, etwas wirklich gehobenes, etwas wirklich teures, weil du für diesen Tag auftauchen willst und gut aussehen willst. Dann besuchen Sie diese Website, die alle schreienden Farben und alle, ich weiß nicht, rot, grün, blau. Das gibt dir nicht so ein Gefühl. Es gibt Ihnen nicht, dass wischen oder die Website, die diese teuren Anzüge verkauft. Irgendwas wird sich also nicht richtig anfühlen. Irgendwas wird das richtig aussehen? Vielleicht wirst du auf den ersten Blick nicht zu viel darüber nachdenken. Aber wie Sie anfangen zu surfen, werden Sie offensichtlich bemerken, dass etwas hier nicht gut ist. Es wird Ihnen nicht das Vertrauen geben, diesen Anzug zu kaufen, denn es gibt Ihnen nicht die Stimmung, die Sie normalerweise von der Anzug-Website erwarten. Dann gehen Sie auf die Konkurrenten Website, die all diese Dinge hat, über die wir für dieses spezielle Beispiel gesprochen haben, Sie werden sich viel mehr zu Hause fühlen. Sie werden sich viel wohler mit Ihrer Kaufentscheidung fühlen und Sie werden sich viel mehr zu Hause fühlen, sozusagen, weil Ihre Erwartungen von dieser Website erfüllt werden , anstatt diese vorherige Website mit all denen, die schreien Farben. Deshalb ist es wirklich wichtig, wenn Sie Bilder auswählen, stellen Sie sicher, dass Sie Nischenbilder wählen, dass Ihr Publikum wird leicht zu beziehen. Daher wird Ihre Website im Gegenzug viel mehr auf Ihre Benutzer und mobile Apps als auch für diese Angelegenheit beziehen, weil Ihre Benutzer werden diese Hinweise, diese Bilder, diese Farben, diese Stile, weil sie an sie gewöhnt sind. Versuchen Sie also nicht zu viel zu experimentieren und gehen Sie wild mit Ihren Bildern. Achten Sie darauf, sich an das zu halten, was Sie wissen, und stellen Sie sicher, dass Sie sich an das halten, was funktioniert, was das Wichtigste ist. Stellen Sie sicher, dass sich Ihre Benutzer wohl fühlen , wenn sie Ihre Website oder eine mobile App besuchen. Denn im Gegenzug bringt das mehr Bekehrungen mit sich. 5. Kostenlose VS Premium: In diesem Video werde ich Ihnen einige Hauptunterschiede zeigen , wenn Sie selbst nach Bildern suchen. Dies sind also die Beispiele, wenn Ihr Client keine Bilder hat. Sie müssen also nach Bildern für dieses bestimmte Projekt suchen. Und ich werde Ihnen einige wichtige Unterschiede zwischen kostenlosen und Premium-Bildern zeigen und was Sie angeblich suchen, wenn Sie nach Bildern suchen. Hier haben wir also unsere Website namens Unsplash.com, die normalerweise das ist, was diese Designer heutzutage verwenden. Und es gibt auch pixabay.com und viele dieser anderen Websites. Aber in der Regel Unsplash und Pixabay sind die Websites, die in der Regel gehen, um zu suchen. Also, wenn wir einen Anzug eingeben, zum Beispiel, wie ich Ihnen in früheren Beispielen gezeigt habe, und wie wir im vorherigen Video gesprochen haben, werde ich Ihnen nur zeigen und die Unterschiede zwischen kostenloser und Premium-Website vergleichen. Wie gesagt, wir haben hier einen Anzug und ich werde diesen Text kopieren und ich werde auf diese Website kommen, die in wichtigen Elementen ist, die eine Premium-Website ist. Und ich werde es einfach hier einfügen. Suchen Sie nach den Fotos, aber Sie können all diese verschiedenen Dinge durchsuchen. Also Stock Video, Video-Vorlagen, Musik, Soundeffekte, grafische Vorlagen wie Druckplatten und UI, UX Kinder, Grafikpräsentation, Dopants, Fotos, Schriftarten und Antwort Web-Vorlagen, 3D und vieles, vieles mehr. Also passen wir uns im Anzug an. Und es gibt auch diese Website namens 2020 Breite, 50 Millionen zusätzliche Bilder. Ja, das sind 50 Millionen zusätzliche Bilder. Und all diese Bilder sind wirklich qualitativ hochwertig von all diesen unabhängigen Fotografen hochgeladen. Also, wenn wir auf diese Website gehen, die 2020 Lager und Typ in Anzug genau hier ist. So haben wir genau die gleiche Suchanfrage auf all diesen Websites. Und was wir hier auf Unsplash haben, ist, wenn wir schweben, haben wir dieses Jägerrennen. Wir haben einen anderen Fotografen, sind weder Fotograf, noch ein Fotograf. All das sind also verschiedene Fotografen. Also gehen wir mit, mal sehen, das ist Benjamin Roscoe genauso wie diese Sorte. Schauen wir uns ihr Profil an. Wie Sie sehen können, machen sie Bilder oder Skylines, Bars, Flüsse, Details. Genau hier haben wir ein paar Bilder von dieser Person in einem Anzug. Aber das ist es im Grunde. Sie können sehen, wir haben nur drei oder vier verschiedene Bilder. Und wieder einmal, diese Balken Bilder den ganzen Weg nach unten. Wieder einmal, wenn ich auf dieses Bild klicke, zum Beispiel, was ich hier habe, ist ich kann klicken, Lesen Sie mehr, um all diese verschiedenen Details zu sehen. Und ich kann die Info eingeben und wir können sehen, dass die Kamera Sony ist, ISO 400. Und das sind die Dimensionen. Also sind diese eigentlich ziemlich gut in diesem Stadium. Und Sie können sehen, wie viele Downloads und Ansichten dieses Bild hatte. Aber wenn wir zurück gehen und zum Beispiel auf dieses Bild klicken , dann gehen Sie zu Info. Sie können sehen, es sind fünf K , aber noch einmal haben wir das gleiche Problem. Wenn ich zum Beispiel auf dieses Profil klicke , können Sie sehen, dass wir diese vielen verschiedenen Bilder haben, aber es gibt nur ein Bild eines Anzugs. Stellen wir uns also vor, dass Sie zum Beispiel diese besondere Farbe des Anzugs verwenden möchten und Sie sie in dieser Umgebung verwenden möchten. Sagen wir, dass drinnen gegen diese Treppen und so was. So können Sie sich vorstellen, dass Ihr Modell drinnen fotografiert wird. Zum Beispiel, sagen wir innerhalb des Einkaufszentrums, machen einen Shopping-Ausflug oder Sonntag liegen tot. Man muss also Bilder von dieser Natur finden. Nun, das ist nur ein Bild und du steckst im Grunde fest. Sie haben keine anderen Optionen. Also, wenn wir zurückgehen und einen Blick auf all diese anderen Bilder eines Anzugs werfen. Wie Sie sehen können, gibt es nicht viel mehr. Vielleicht gibt es diesen, aber es hat einen Weihnachtsbaum darin. Es wird also nicht für alle Ihre Gelegenheiten funktionieren. Und wie Sie sehen können, gibt es hier nicht viel Option für Ihr bestimmtes Projekt. So können wir auf einige dieser Websites gehen und wir können etwas finden, das für uns funktionieren wird. Also lassen Sie uns sagen, dass dies das Einkaufszentrum ist und das ist der Laden innerhalb des Einkaufszentrums. Also lassen Sie uns das innerhalb einer neuen Registerkarte öffnen. Lassen Sie uns schnell bemerken, dass dies zum Beispiel acht K groß ist. Und Sie können diese Informationen weiter lesen. Sie können mehr darüber erfahren. Und wir können sehen, dass es vier ist, erfordert Schneiderei Designer-Workshop. Aber wenn ich hier scrolle, können Sie sehen, dass es alles aus der gleichen Serie ist. So können Sie das gleiche Modell sehen, die gleiche Art von Hintergründen, die gleiche Beleuchtung, der gleiche Fotograf. So können Sie über Bilder sehen, ist ein Fotograf. Also alle von ihnen, und was ist großartig daran ist, wenn ich klicke, Mehr sehen und öffnen Sie in neuer Registerkarte, können Sie sehen, wie viele dieser verschiedenen Bilder wir haben. So können Sie klar eine Geschichte aus all diesen Bildern erstellen. So können Sie auf Ihrer Seite beginnen, indem zum Beispiel Ihren Benutzer in Ihrem Shop begrüßen ihnen dann die Qualität Ihrer Anzüge erklären und wie sie hergestellt werden, wie viel Zeit es dauert, bis jede Person einen bestimmten Knopf sieht, zum Beispiel, und so etwas. So können Sie wirklich auf die Details mit diesen Bildern zoomen , weil sie 8 K Qualität haben und sie wirklich riesig sind. Sie können ihnen dann erzählen, wie die Ausstattung funktionieren wird, wenn sie versuchten, zu passen, wie sie sich fühlen. Wann waren die Materialien für den Anzug stammen und so viel mehr. So können Sie das mit diesen Premium-Bildern machen. Sie können wirklich eine Geschichte erzählen, anstatt nur ein singuläres Bild zu zeigen. Was das tun wird, ist es wird Ihre Website viel professioneller aussehen, viel polierter. Denn wieder einmal können Sie Ihren Betrachter in dieses Erlebnis eintauchen , weil Sie alle diese verschiedenen Bilder aus dem gleichen Set haben. Also schauen wir uns sie noch einmal an. Sie können sehen, dass sie Kaffee trinken. Wir haben hier Fitment. Wir haben Tests des Materials. Wir haben hier Fitment. Wir haben, zum Beispiel, Einigung hier haben wir einige verschiedene Materialien. Wir haben, wie die Ti passen wird. So können Sie nur an einem Beispiel allein für diese Anzüge deutlich sehen, wie viele dieser verschiedenen Bilder wir haben. So können Sie sich einfach vorstellen, auf diese Details zu zoomen und wie viel Sie tatsächlich mit all diesen verschiedenen Bildern tun können , anstatt nur mit einem einzigen Bild. Endlich können wir das Gleiche hier machen. Also, wenn ich in Anzug tippe und ich es öffne, haben Sie diese verschiedenen Sammlungen und innerhalb dieser Sammlungen. Also, wenn ich sie öffne, können Sie verschiedene Fotografen finden. Also zum Beispiel, ich mag diesen Anzug wirklich. Vielleicht kann ich reingehen und danach suchen, oder vielleicht kann ich mir das hier ansehen. Das sind also die Sammlungen. Sie können diese Sammlungen von diesen verschiedenen Fotografen öffnen und dann können Sie zusätzliche Bilder erkunden. Also hier haben wir dieses Bild und dieses Modell. Wenn ich also hier klicke und ihre Sammlungen öffne, haben wir diese verschiedenen Fotos, wir haben verschiedene Lappen, wir haben all diese verschiedenen Dinge genau hier. So können wir alle Bilder von diesem Fotografen erkunden und sehen. Sie können deutlich sehen, dass wir eine Reihe von diesen verschiedenen Bildern haben. Aber noch einmal, wenn Sie nicht Lust auf 2020 und all diese verschiedenen Bilder, können Sie immer wieder auf Envato Elemente zurückgehen weil diese beiden Teil der gleichen Sammlung sind. Wenn Sie also dieses Abonnement für Envato Elements erhalten, das ein Jahresabonnement ist, wird dies enthalten sein. Also, wenn Sie hier kein Bild finden können, dann können Sie vielleicht auf 2020 versuchen. Sie können sehen, dass es von Envato sagt. Das sind also nur einige verschiedene Vergleiche zwischen kostenlosen und bezahlten Bildern. Vergewissern Sie sich, dass Sie aufgrund dieser Einschränkungen, die ich gerade erwähnt habe, keine hochglanzpolierte professionelle Arbeit mit hochglanzpolierte professionelle Arbeit mit kostenlosen Bildern machen können, müssen Sie professionelle Assets wie Bilder von, für Beispiel Envato Elements. Sie müssen keine Envato-Elemente verwenden. Sie sind eine Reihe von verschiedenen Websites da draußen. Aber weil ich Ihnen gezeigt habe, was in Ihrem Abonnement enthalten ist, ich mag sie wirklich und ich benutze sie jeden Tag für meine Projekte. Dies im Gegenzug wird ihre Projekte polierter, viel professioneller aussehen lassen. Und wenn Sie versuchen, Ihnen Ihr Design an Ihren Kunden zu verkaufen, zum Beispiel, wenn Sie versuchen, sie zu präsentieren, sind Design eine DEA, eine Design-Änderung, komplette Redesign oder Sonntag liegen tot. Das mit diesen professionellen und polierten Bildern zu tun, wird viel einfacher sein , als nur ein paar verschiedene Bilder von verschiedenen Fotografen mit unterschiedlichen Belichtungen, mit verschiedenen Modellen auf eine Seite zu schlagen ein paar verschiedene Bilder von verschiedenen Fotografen mit unterschiedlichen Belichtungen, und dann versuchen, sie tot zu verkaufen. 6. Bildoptimierung: Ein weiterer wichtiger Teil, wenn Sie Projekte mit diesen Bildern erstellen, insbesondere diese riesigen Bilder, ist die Bildoptimierung. Das bedeutet, dass Software Ihrer Wahl die Größe des Bildes reduzieren wird, was wiederum viel schneller auf den Server hochladen wird, zum Beispiel. Das wiederum wird Ihre Website viel schneller laden und gibt ihm eine bessere Google-Ranking, was eine bessere SEO bedeutet. Also im Grunde ist diese SEO Optimierung extrem wichtig, vor allem auf einer Website Design-Projekte, auf mobilen Design-Projekte, Es ist wirklich wichtig, als auch, vor allem, wenn Sie ziehen aus der gleichen Datenbank. Optimierung Ihrer Bilder wird Ihren Benutzern eine viel bessere Erfahrung geben , ohne die Qualität dieser Originalbilder zu verlieren. Also, wenn ich dich noch einmal hier zurück zu Envato Elements bringe. Und dann können Sie zum Beispiel dieses Bild sehen, das wir uns zuvor angesehen haben. So wie Sie sehen können, fast 8 K in der Größe. Wenn ich also auf Download klicke, wird es all diese verschiedenen Klassenprojekte hochziehen. So zum Beispiel werde ich es Image-Projekt nennen, oder unser Image-Projekt, zum Beispiel. Und ich kann einfach dieses Projekt erstellen. Nun, was das bei Envato Elements bedeutet, ist, dass ich all diese verschiedenen Elemente zu diesem speziellen Projekt hinzufügen kann. Sie können sich also vorstellen, dass ich all diese verschiedenen Bilder verwenden werde. Ich werde verschiedene Symbole verwenden, vielleicht sogar ein WordPress-Theme. Vielleicht brauche ich Musik aus meinen Videos. Also all diese verschiedenen Elemente, die Sie von Envato Elements heruntergeladen haben , können Sie einfach in dieses Projekt, das wir erstellt haben, einfügen. Gerade jetzt bedeutet das, dass es für Ihre Kunden viel einfacher wird , all diese Elemente zu lizenzieren, falls so etwas notwendig ist. So können Sie beispielsweise ein Abonnement für eine unbegrenzte Anzahl von Clients in jedem Client verwenden können ihre eigenen Projekte haben, was bedeutet, dass die Lizenzierung so einfach sein kann, wie einfach nur eine Lizenz kopieren und sie dann an Ihre Kunden senden und Gefahr und werden diese Lizenz enthalten und sie werden sie behalten. Daher müssen Sie diese Lizenzen nicht jedes Jahr aktualisieren. Grundsätzlich, wenn Sie dafür bezahlen, sobald Sie es herunterladen, ist das alles. So können Sie ganz einfach alle diese verschiedenen Elemente lizenzieren, einschließlich Bilder auf Envato Elements für Ihre Projekte. Also, wenn wir zurück zu hier gehen, kann ich einfach auf unser Image-Projekt klicken, um dieses Projekt zu erstellen. Dann kann ich einfach hinzufügen und herunterladen. Und es wird anfangen, direkt hier herunterzuladen. Jetzt können Sie sehen, dass dieses Bild ziemlich riesig ist. Es ist eigentlich fast 18 Megabyte groß. Sobald es heruntergeladen wurde, ist es jetzt an der Zeit, unsere Bilder zu optimieren. Jetzt ist die Bildoptimierung nichts wirklich Neues. Es wird seit Jahrzehnten von Entwicklern und seit einigen Jahrzehnten auch von Designern gemacht. Im Grunde, was es ist, wird es einfach die Anzahl der Pixel innerhalb Ihres Bildes reduzieren. Es wird die Größe Ihres Bildes enthalten wird Schärfe enthalten, wird Qualität enthalten. Aber im Gegenzug wird es Ihnen eine viel kleinere Dateigröße geben, da all diese verschiedenen Kameras einfach die Dateigröße hinzufügen, insbesondere abhängig von dem Objektiv, das Sie verwenden, und dem Kameramodell, das Sie verwenden. Um Sie nicht mit zu vielen Details zu langweilen, werde ich Ihnen das in der Praxis zeigen. Also, weil ich unter Windows bin, benutze ich etwas, das Riot genannt wird. Und wenn Sie auf einem Mac sind, Sie können etwas namens Bild optimal eines lebte eine PDF-Datei verwenden. Und Sie können einfach auf den Link klicken, um das herunterzuladen, was Sie jedes Jahr benötigen. Und es gibt viele verschiedene Tools für beide Betriebssysteme, sowohl Windows als auch Mac. Es liegt wirklich an Ihnen, zu entscheiden, welche Sie wählen möchten. Ich wähle, richtig? Und ich benutze es seit Jahren und es hat gut für mich funktioniert. Wenn ich dich zurücknehme, kannst du einfach sehen, wie der Aufstand aussieht. Und da ist es. Es ist wirklich ein grundlegendes Werkzeug und wirklich wollen , dass Sie leicht lernen können, zu verwenden und im Grunde, was es tut. Es, es hat diese beiden Windows und wenn ich Drag & Drop mein Bild drinnen, so ist dies das Bild, das wir gewählt haben. Sie können sehen, dass Sie Bild öffnen können, können Sie Batch-Importbilder, was noch einmal wirklich wichtig ist, vor allem, wenn Sie mit diesen Sammlungen arbeiten. Also, um keine Zeit zu verlieren. Stellen Sie sich vor, Sie haben zum Beispiel 50 verschiedene Bilder, die Sie herunterladen. Und das ist die große Welle. Zum Beispiel von Envato Elements. Sie können nicht einmal alle diese Bilder verwenden, aber es ist großartig, weil sie da sind. Sie können sie einfach alle auswählen, sie alle herunterladen, in die gleiche Sammlung einfügen und sie jetzt alle optimieren, richtig, zum Beispiel. Also genau hier werde ich einfach ein Bild verwenden. Und was ich tun werde, ist, ich werde klicken und ziehen Sie es hier. Wenn es einmal geladen wird, wird es mich dazu auffordern. Diese Datei enthält also ein hochauflösendes Bild. Rad kann solche Bilder verarbeiten, aber die Verarbeitung kann in dieser Situation ziemlich langsam sein. Sie wollen die Größe für uns ändern. Es wird empfohlen, dass das Originalbild nicht geändert wird. Also merken Sie einfach, was passieren würde, wenn ich auf Ja klicke. Es wird uns diese Originalgröße geben. Es wird also eine neue Größe skalieren, 100 mal 100. Behalten Sie also das Seitenverhältnis. Dies ist in Prozent, da Sie hier sehen können und Sie es in bestimmte Pixel senken können. Aber ich würde Ihnen empfehlen, diesen Prozentsatz gleich zu halten. So n wird einfach gedacht, wo es im Grunde auf 100%. Was das bedeutet, ist, wenn ich auf OK klicke, können Sie das erste Bild direkt hier sehen. Also 17,5 Megabyte in der Größe, und das neue Bild ist 3,4 Megabyte groß. Jetzt wird es viel langsamer geladen. Wenn ich also hier klicke und den Mauszeiger klicke, kannst du 17,5 Megabyte sehen. Und das ist das Bild hier. Aber wenn ich es optimiere, wird es 3,4 sein. Also, wenn ich hier auf Speichern klicke, möchte ich es ersetzen. Ich möchte ja eingeben. Enden werden im Grunde dieses Bild ersetzen. Also, wenn ich jetzt klicke und 17,5 Megabyte schwebe, lassen Sie mich es aktualisieren. Und Sie können sehen, es sind 3,4 Megawatt. Also haben wir im Grunde mit 17,5 Megabyte angefangen. Wir sind jetzt bei 3,4 Megabyte. Und was am wichtigsten ist, wenn ich hier schwebe, sehen Sie 79, 52 mit 53, 04. Und wenn wir es hier zurückbringen, können Sie sehen, dass diese nicht genau die gleichen Dimensionen sind wie beim Originalbild. Es reduziert nur die Größe des Bildes über alle. Also, was das für Sie bedeutet im Grunde wird Ihren Entwicklern viel mehr Spielraum geben , weil Sie diese Dateigrößen reduzieren, können Sie noch weiter gehen. Zum Beispiel verwende ich Adobe XD täglich, um alle meine Projekte zu entwerfen. So können Sie sich vorstellen, dass ich dieses AK-Bild in etwas setzen werde, das ist, Lassen Sie uns zum Beispiel sagen 1920 von 1080. Und dann werde ich es aus dem Exil in dieser speziellen Resolution exportieren. So 1920 um 1080, die wird noch weiter reduzieren den benötigten Platz. N wird die Größe dieses Bildes noch weiter reduzieren. Du könntest also sagen, warum nicht einfach so benutzen? Nun, weil Sie all diese riesigen Bilder in Ihre Software Ihrer Wahl ziehen. In meinem Fall wird Adobe XD massiv zurückbleiben, weil dies riesige Dateien sind, wie Sie gesehen haben. Also nur dieses spezielle Bild allein ist 17,5 Megabyte. Die meisten meiner Dateien sind etwa 20 Megabyte. Sie können sich also nur vorstellen, dass die gesamte Designdatei 20 Megabyte beträgt, und das nur ein einziges Bild ist 17,5 Megabyte. Also halten Sie diese Dinge im Hinterkopf, wenn Sie erstellen, vor allem für Web, weil Sie versuchen, Google Optimize diese Website. Und Sie versuchen, so viele Leute diese Website wie möglich finden zu lassen. Daher ist es für Sie wirklich wichtig, diese Bilder zu optimieren. Und wenn Sie mit mobilen Design-Projekt arbeiten, ist es auch wichtig, weil dann das Betriebssystem und die App selbst, es wird nicht alle diese riesigen Bilder aus der Datenbank ziehen wird nur ein einziges Bild ziehen die ziemlich klein ist. Und es wird immer noch diese riesige Qualitätsschuld enthalten , hatte es ursprünglich Fotograf ging, nahm das Bild. 7. Benennungsstruktur: Genau wie bei der Optimierung Ihrer Bilder, ist es wirklich wichtig, Ihr Bild richtig zu benennen, weil sie auf diese Weise richtig auf Ihrer Website oder auf Ihrer mobilen App angezeigt werden. Es wird viel einfacher für Ihre Entwickler, diese Bilder zu finden, sie in Code einzubinden. Und es wird viel einfacher für Code sein, diese Bilder aus Datenbanken zu ziehen. Also lassen Sie mich Ihnen nur zeigen, was ich meine auf dem Bild, das wir gerade heruntergeladen haben. Also, wenn wir uns dieses Bild ansehen, ging ich voran und lud es wieder im selben Projekt herunter. So können Sie den Namen bis Jahr sehen, dash PA zu VMs, C4 oder was auch immer. Und das ist die reduzierte das Bild. So wie Sie noch einmal sehen können, 17,5 Megabyte, so Originalgröße und Sie können den Titel direkt hier sehen. Und wenn ich Sie hier rechts nehme, können Sie sehen, dass wir so einen Namen haben. Also, was wir mit diesem Bild machen können, weil es in unsere Software der Wahl aufgenommen wird. In meinem Fall, Adobe XD. In Ihrem Fall könnte es sein, Sketch figma Photoshop Illustrator ist nicht wirklich wichtig. Also, was Sie mit diesem Bild tun können, ist, dass Sie mit der rechten Maustaste darauf klicken und es auf diese Weise umbenennen können. Auf diese Weise, wenn Sie es ziehen und legen Sie es in Ihre Software Ihrer Wahl, Es wird sich an diesen Namen erinnern und dann, wenn Sie es exportieren , es wird es so exportieren. Die andere Sache, die Sie tun können, ist, dass Sie zu etwas wie Lightroom gehen können, und Sie können es Metadaten dieses bestimmten Bildes hinzufügen, das wird Ihnen viel mehr Details darüber geben, wann dieses Bild ist, wurde mit welcher Kamera aufgenommen mit welcher Linse, mit welcher Belichtung und so weiter. Dies könnte also von Ihnen verlangt werden, wenn Sie an einer Art von Grafikdesign-Projekt arbeiten, zum Beispiel für Editorials und Sachen wie Papa, besonders wenn dieses Bild auf riesigen Leinwänden gedruckt wird. Also werden einige riesige High-End-Kunden all diese Informationen für ihn benötigen, Sie. Stellen Sie also sicher, dass Sie verstehen, egal an welcher Art von Projekt Sie arbeiten, es gibt einige Anforderungen von Ihnen, aber für die meisten dieser Webprojekte und App-Design-Projekte, einfach umbenennen Sie Ihre Datei wird gut Genug. Wenn ich Sie also noch einmal hier zu unserem Bild zurückbringe, können Sie sich nur vorstellen, dass sich dieses Bild zum Beispiel in Ihrem Heldenbereich befinden wird. Was Sie tun können, ist mit der rechten Maustaste Umbenennen und nennen Sie es einfach Held, IMG. Oder wenn Sie ein Entwickler sind, um Bindestriche hinzuzufügen, dann fügen Sie Held, Bindestrich, IMG oder Unterstriche wie folgt hinzu. Also hier unterstreichen IMG. Das hängt also wirklich von Entwickler zu Entwickler ab. Wenn Sie also mit Ihrem Design beginnen, wenn Sie Zugriff auf Ihre Entwickler-Kontaktinformationen haben, fragen Sie sie vielleicht einfach diese oder fragen Sie einfach Ihre Kunden, damit sie Ihren Entwickler fragen können. Dies wiederum wird viel schneller für Sie sein, wenn Sie anfangen zu erstellen, so dass Sie alle diese Bilder und Assets umbenennen können, zum Beispiel Symbole in Illustrationen, bevor Sie mit der Arbeit beginnen, dann später, wenn Sie anfangen zu arbeiten. Und dann müssen Sie alle diese Dateien umbenennen, sobald Sie sie tatsächlich in Ihre Software Ihrer Wahl einschließen. Ich weiß, dass es in Adobe XD wirklich ein großer Schmerz ist, wenn Sie Bilder wie mit diesem Namen bis zum Pfeil einschließen, 58 zu was auch immer. Und wenn Sie versuchen, sie auf Ihren Desktop zu exportieren und sie an unsere Entwickler senden möchten, müssen Sie zum Beispiel alle manuell in Ihrem Exportordner umbenennen. Und vor allem, wenn Sie sie mit etwas wie Sapling teilen, zum Beispiel mit Ihren Entwicklern, dann müssen Sie sie in Zeplin umbenennen. Es ist also wirklich ein Trubel. Wenn Sie alle Ihre Bilder oder zumindest einige Ihrer Bilder im Voraus umbenennen können, weil dieser Weg wird viel einfacher für Sie zu entwerfen und auch stellen Sie sicher, Ihre Entwickler zu fragen, welche Art von Abkürzung fällig Tag wie. Auch wenn Sie zum Beispiel dieses Heldenbild verwenden und sich nur vorstellen, wenn ich Sie hier mitnehme, dann geht es vielleicht um uns. Dies wird Produkt 1 sein, dies wird Blog-Abschnitt eins sein. Das wird ein Zeugnis sein, oder was auch immer. Vergewissern Sie sich, dass Sie alle Ihre Bilder richtig umbenennen. Also zum Beispiel, wenn Sie ein Testimonial vier Bilder haben, dann fragen Sie Ihren Entwickler nach Abkürzung. So zum Beispiel, Zeugnis Strich eins, Zeugnis, Bindestrich zwei, Strich drei, Strich vier und was auch immer oder Unterstrich oder ohne Bindestriche, Unterstriche und so weiter. Also nur Zeugnis für alle von ihnen zusammen. Stellen Sie sicher, sie zu fragen, wie sie Kappen mögen, Feststelltaste eingeschaltet. Aber die Mehrheit der Entwickler nicht. Die Mehrheit der Entwickler zumindest, dass ich weiß, verwenden gerne Bilder mit kleinen Buchstaben und Zahlen, so dass sie nicht mögen, dass sie Caps zum Beispiel aussehen. Das sind also nur ein paar Tipps und Techniken, die ich gerne mit euch teilen möchte, weil ich denke, dass es Ihre Zeit mit diesen Projekten massiv verbessern wird, und es wird die Qualität Ihrer Lieferung an Ihre Kunden massiv verbessern. 8. Dein Kursprojekt: Ihr Klassenprojekt für diese Klasse besteht darin, eine Art von Bildkombination zu erstellen , damit Sie entweder kostenlose oder Premium-Bilder verwenden können. Es liegt wirklich alles an dir. Was ich nur möchte, dass Sie tun, ist, Ihre Lieblingssoftware Ihrer Wahl zu verwenden. So können Sie Photoshop, Illustrator, XD, Skizze, Figma, welche Software Sie verwenden, vielleicht sogar Canva, wenn das Ihr Ding ist und Sie wie Canva sind. Aber im Grunde möchte ich, dass Sie ein eigenes Projekt erstellen, indem Sie Ihre eigenen Bilder verwenden, so dass diese entweder kostenlose Bilder von Websites wie Unsplash oder Pixabay, Premium-Bilder von Websites wie Envato Elements und wie ich zeigte Ihnen, im Grunde, was ich möchte, dass Sie tun, ist, Bilder zu erstellen, die sich zueinander beziehen. Das kann also entweder in Farbe oder in der Klasse oder im Stil sein, oder im Grundformat oder was auch immer Sie wollen. So wie zum Beispiel, ich habe Ihnen mit dem TI-Beispiel gezeigt, vielleicht können Sie etwas mit diesen Anzügen verwenden. Vielleicht können Sie Farben der Anzüge zusammen kombinieren, nur um eine Art Stimmung für Ihr bestimmtes Projekt zu setzen. Sie können Auto-Bilder verwenden und Sie können bestimmte Auto-Stil verwenden. Also zum Beispiel, wenn Sie einen Luxus wollen, dann werden Sie Limousine verwenden. Und in der Regel sind diese Limousinen schwarze Farbe. Aber noch weiter davon, ist das Auto auf der Straße, ist das Auto zum Beispiel auf einigen schnell an Ort und Stelle wie Monaco geparkt ? Oder kommt jemand aus dem Auto raus, wie Berühmtheit. Stellen Sie also sicher, dass Sie auf diese Panzer achten. Wählen Sie die Nische aus, die Sie wollen, welches Format Sie möchten. Aber was ich will, dass Sie tun, ist, all diese Bilder zusammenzustellen. Es muss nicht viele sein. Sie können 56 Bilder verwenden, etwas, das ich albern getan habe, um sie auf ein einziges Dokument zu setzen. Sie können A4 oder Buchstabengröße verwenden, wenn Sie aus den USA kommen. Legen Sie sie einfach zusammen, rettete ihn als JPEG und lade sie in Ihre Klassenprojekte hoch , um zu sehen, was ihr euch einfallen könnt. Und ich bin wirklich interessiert zu sehen, wie Sie diese Bilder für Ihre Projekte optimieren und wie erstellen Sie diese Looks und Feels für Ihre persönlichen Projekte? Denn wieder einmal, ich bin wirklich interessiert zu sehen, was ihr euch einfallen könnt und ich kann es erwarten, sie in eurer Klasse zu sehen, Projekte. 9. Outro / Abmoderation: Also gehen wir hin. Wir haben das Ende der Klasse erreicht. Ich hoffe wirklich, dass Ihnen diese Klasse gefallen hat und ich hoffe wirklich, dass Sie hier und da ein paar Dinge auswählen werden , über die Optimierung Ihrer Bilder, über die Auswahl Ihrer Bilder, indem Sie sie in diese verschiedenen Kategorien setzen, in diesen verschiedene Sammlungen und wie Sie weiter mit Ihren Projekten fortfahren werden, sind wirklich ermutigen Sie, die Read Me-Datei zu überprüfen, weil ich ein paar Dinge in dieses PDF einfügen werde. Sie können einfach auf die Links klicken. Es bringt Sie zu dem Link, zu dem Sie gehen möchten. Und ich hoffe wirklich, dass Sie zumindest diese Bildoptimierungs-Tools verwenden werden, weil ich wirklich glaube, dass sie Ihre Arbeit verändern werden. Und es wird im Grunde Ihre Beziehung zwischen sich selbst und Ihren Entwicklern verbessern , weil sie Sie viel mehr mögen werden. Weil Sie alle diese Bilder optimieren und sie eine Menge Zeit gespeichert haben, die sie verlieren würden. Ansonsten hoffe ich wirklich, dass Sie zur Kenntnis nehmen werden. Und wenn Sie das nächste Mal mit der Auswahl dieser Bilder beginnen, setzen Sie sie in Sets und stellen Sie sicher, dass sie den gleichen Ton verwenden, verwenden sie dasselbe Modell, die gleiche Beleuchtung. Denn nur das allein wird viel mehr Professionalität in Ihr Design bringen und wird es hervorheben und Ihre Kunden werden Sie einfach dafür lieben. Also danke nochmals, dass Sie diese Klasse gesehen haben und ich hoffe wirklich, Ihre Arbeit innerhalb des Klassenprojekts zu sehen und bis zum nächsten Mal, kümmern Sie sich um.