Transcripts
1. Class Preview : I shifted through thousands of projects and websites to search for common themes and trends. Coming into 20-20. Trends usually developed because of an evolution in technology or new tools and common software that make it easier to accomplish certain effects or styles. Take for instance, the frosted glass effects seen lately. By using Adobe XD, a program for creating web and mobile app layouts. You can create this effect and just a few seconds. And we'll create our very own frosted glass effects and apply a simple animation to create the project. You see here. Adobe dimensions earlier in 2020. Out of the Type effect feature, where you can quickly add 3D type objects. You can change the material lighting to get some pretty awesome topography that jumps off the screen and it's incredibly easy to do this. We see trends and topography like using condensed typefaces. We will be covering some of my favorite easy to find condensed type basis so we can create a couple of quick, effective Instagram posts. Lastly, we'll cover trends and color. We'll discuss how color is taking over. Not just one color choice, but really a total color coverage on design surfaces. And we'll talk more about what that means when we study trends. Not just to chase the next cool thing, but to also become relevant as designers who can move forward instead of just standing still. So let's review some of the design themes and trends I see moving into the year 2021. Not only that will create these trends, doing quick, exciting projects for each major trend. So I'll see you in the next lesson.
2. Trends in Color : 20-20 with a rough year. It was a dark and very isolating year for most of us. And most of us made big changes in our lives due to covert 19. Some of us switched careers and some may have moved to be closer to a support system. The one thing we like about 20-20 is that it's over in 2021, is here. Pan tone comes out with a color each year and labels it a hot, new trendy color. And 20-20 pan tone selected this classic blue color. Dole and dark blues can evoke a sense of calm and trust. They can also indicate sadness and loneliness. Pantone did not know about COBIT 19 and it would change the world that year when they selected this color. But I think it was a very fitting color that match the mood for that year. In 2021, pan tone selected this more vibrant yellow, paired with this steady medium tone gray. Leah tourists Eisenmann, the executive director of the Pantone color Institute, said this, the union of an enduring ultimate gray with a vibrant yellow illuminating expresses messages of positivity supported by fortitude, practical and rock solid, but at the same time, warning and optimistic. This is a color combination that gives us resilience and hope. As we study in a lot of lessons I teach about design theory and color theory is yellows are tough colors to use, but they do evoke a feeling of energy and hope and optimism and exactly what we're all needing after year of blue. But what I discovered when researching trends and projects is not just the brighter, vibrant hues that will crop up, but it's more total color coverage on a project. This means packaged designs, for example, will be more expressive and dedicate more of the total design space to colour in general. Take for instance, the packaging I researched and stores. Some products can do well by using a more modern brutalist presentation was stark white backgrounds and simple topography. That is great if it echoes your brand style. But I found products that had more full total color coverage on packaging really, really caught my eye. The packaging design I saw was illustrative, hopeful, exciting, and just plain cool. If the product has a series, then color was used to denote a different flavor or type of product. We can also see this in digital design projects like mobile app designs and websites. Less just plain whitespace is used and more photos and full colour backgrounds and headlines are used. More colourful design elements peek through the backgrounds and lots of high-contrast colors are being used. Neutral colors like Grey's tans seemed to be popular in recent years. I think we'll find that we see less neutral colors in place of more saturated hues. In 2021. Color selection can be tough as a designer, some colors match, accompanies industry, while others, they're purely there to evoke certain thoughts or emotions. I think that understanding the global issues that affect us can help guide or color choices moving forward. Especially during the times when we're all feel like we're affected equally. As they see more designers dedicate areas of their design to color. I see this as a way to bring more cheer, hopefulness and light and a world that desperately needs it.
3. Trends in Typography : This next trend, one that affects topography. As a practical one, people have a lot to say in social media messages. We are taught to be authentic and genuine and expressive of our feelings on social media to be relevant and shareable. All of that takes a lot of space and they can rarely be done in very short simple phrases. This is where condensed side faces can be very helpful. Take for instance, this typeface for an Instagram post. This one is Acumen variable concept and it has a Standard Character width that matches other typefaces and its classification. Condensed typefaces use more narrow character widths, allowing you to fit more characters and a total space. This image uses the same typeface, but a condensed version of the same typeface. I'm able to include my headline and still have room left over at the bottom for a visual or photo. Amazingly, both of these use the same 50 size for its type size. What a difference using a condensed typeface makes. Instagram post are becoming packed with information as Saves become more important and valuable than likes. When you save a post, it's because it has a lot of information that's hard to remember. So you can save it for later. Instagram takes saves seriously and decides that posts with more saves must be more engaging. Therefore, they tend to rank these post higher in search. This is why you see the trend of using condensed topography. There are logical practical reasons why trends emerge, and this is a great example of that in action. And with any trend you see people pushing it further. This is when we see dramatic examples of condensed typefaces, like the ones being used here. Some of these are custom type faces and some are just hand-drawn or illustrated in vector. These elongated characters allow topography to take the center-stage, creating interesting tension and a normally blank space. Another development is the use of outline type. This allows areas behind the type to be seen, but also allows topography elements to be overlapped. Once again, it gives us more room in our design. I also see this used often and motion design and short attention-grabbing video's outline type paired with solid type, make super interesting videos. What I think is unique about the outline type is how the outline brings more focus to the character shapes. This means typography can becoming a stronger presence and the design. We're going to explore some popular, commonly seen condensed typefaces you can find and start to use in your social media posts will be creating several examples from our shortlist. And we can see how we can fit longer headlines into smaller areas and still allow the design to breathe and enjoy proper margins in whitespace. You will also learn how to integrate outline typography so we can create unique type presentations. So let's hop right into Adobe Photoshop.
4. Frosted Glass and Glassmorphism: The next trend we're going to cover is called glass morphism or frosted glass design elements. There's something really interesting about looking through an object to see light reflected through it, and seeing that slight distortion, just like looking through a frosted window. It feels very new and fresh. And this design trend will soon be taking over. Back in 2020, I talked about how something called skeumorphism was becoming a popular user interface design trend. As we studied last year, this is the art of making objects seem tactile and more realistic with added effects, shadows, and highlights. This can include buttons, borders, and icons. This evolved into new morphism, which we saw popularized and 20-20 with its more monochromatic color themes. Almost eight glossy, glossy appearance. Glass morphism is another evolution of this trend and takes it a few steps forward by adding transparency elements to objects. This creates a frosted glass effect that allows objects to be distorted behind the glass, giving objects a huge amount of depth in this space. What is really interesting about this trend is it allows background gradients and textures to be seen even when blocked by design objects, buttons and boxes. This can push background objects forward while still maintaining the visibility of important objects on top. This allows an almost 3d space. In 2D. You can see this icon set uses frosted glass to allow the red circle to still be seen tucked away behind the top circle. This effect can work well in both dark and light moods, which is essential for any user interface style these days. So far, this trend has been seen with mobile app layouts and web design, as seen here in this project example. I think what makes it effective is by selecting Just a few objects to be transparent. In this dark mode user-interface, the background has a slight frosted glass effect. In mixture, the design maintains focus. Why still making everything readable and easy to use? This website landing pages is just a few small touches of the frosted glass to make this illustration of feel more layered, but it never overwhelms the design. This example allows the vibrant textured background graphic to be seen through the design. But the frosted effect helps keep the text readable and visible. This is a hard effect to pull off and most software, because you have to add this frosted glass effect layer by layer manually. But Adobe XD has a feature where you can create live frost glass-like effects. We're going to create an animated that glass UI elements using this tool. It is surprisingly quick and easy to start using. I promise it'll just be a few minutes and frosted glass or suddenly appear on your screen. So I'll see you in Adobe XD.
5. 3D Typography : Back in 20191 of my design trend predictions was seeing more 3D objects and design. 3d is what I consider a macro trend or a trend that can span years, if not decades. I believe we're in the middle of a 10-year 3d super trend. This is because there have been a lot of advancements in 3D software to make it more approachable and easy to use. There is a free 3D motion software called blender that gives anyone access to 3D creation tools without any cost. And this is why we are seeing an explosion of not just 3D objects, but now 3D topography. As mentioned earlier, Adobe dimensions and early 20-20 came out with a new type 3D object feature, where you can quickly make any type face as a 3D object. You can apply various materials and skins to this 3D object to make it hyper realistic. In 2019, when I first talked about 3D objects as a trend, we used Adobe Photoshop to create simple 3D objects. Photoshop is great for doing what, 30 projects, but the trend in 2021 will focus more on the hyper-realistic topography look. This means 3D type will have more realistic lighting materials, refraction, reflections, another effects that are once impossible with lower costs, software expect more bevels and 3D type. This creates complex layers that add depth and richness. It can also make type fill rounder and softer. I think we'll start seeing less super shiny materials being used, but more mat or low glossy effects, giving type a tactile feeling. There will be more experimentation with textures and shapes within 3D type. Instead of just using one simple single material in a character. As software improves the appearance of light and shadows and 3D, you'll notice more refraction, glass and characters with transparency as well. And we are going to create our very own 3D topography poster using Adobe dimensions. We will stack are letters, so they hold each other to create a unified design. I'll see you in Adobe dimensions, and this is actually a lot easier than you're thinking. So I'll see you in the next lesson.
6. Project #1 - Social Media Posts - Condensed Type: Welcome to the first project at the design trends 2021 lessons. What I wanted to do is provide a practical project that pairs well with the trend that I'm talking about. So you can have something tangible that you can start to deploy in your own graphic work. So a common thing I run into is social media posts, something everyone needs to learn how to design at some point. And I wanted to talk about convinced typefaces here. And so I have this as a downloadable resource. You can go ahead and grab that here. Wherever you find the downloadable resources in the lessons. And I have access to ten or more condensed typefaces that are pretty common defined. And there's two places I found these typefaces. I tried to keep it as simple as possible. There is Adobe fonts and also Google fonts. So you can go to Google Fonts, those are open to anyone. Anyone can download the Google fonts. And for the Adobe fonts. Anyone that can do that, if you have an Adobe Creative Cloud subscription, if you have that, you can access all of the Adobe fonts. And of course, if you know what to look for, all you have to do is typing condensed and any cat tuck type of place where you can find fonts and you should be able to find plenty available. They're pretty, pretty common typefaces and fonts. So here we aren't Adobe Photoshop. We're gonna create a simple art board for an Instagram post. So we're just gonna go to File New and we're going to do 1080. By 1080, I like to do a nice high resolution because you never know when you're going to be needing to use these. So we have nice crisp resolution and pretty much everything else default. We're gonna go ahead and create it. And I want to try to find a photo. What I wanna do is have a simple headline, very short so we can kind of practice are condensed typography. We're gonna create this that you see right here. We're going to pair font, a headline with a photo. So we're just gonna go ahead and find a photo. I loved to find all of my photos from pixels.com. This one's by Marcello Diaz. And what I wanna do is instead of providing you with a link directly to this, you can simply type in the artist's name or the photographer's name and find it because a lot of times photographers removed their photos and it makes those links not work and broken. So instead of that, you can do that or you can type in black background. We're gonna do like a dark black background posts. So you can use any of these as your subject matter, just trying to find a photo that we can easily isolate and put a new background behind it. Now that we have the photo loaded, I'm going to go ahead and unlock the layer. I'm just going to copy command C. I'm just copying, and I'm going to bring that over to my blank document and go ahead and click OK. What I wanna do is I went to right-click and I like to convert everything to smart objects, especially photos when I downsize them just so it retains the original resolution and it doesn't blur when I try to make it bigger again, some, if I decide to make it bigger, and I want to go ahead and isolate the subject here. Quick way to do that is go to select subject. I use this a lot of my lessons, so we're just going to do a nice quick selection. And I chose this photo because it easily, it doesn't works really well with that select algorithms like the object algorithm. So I'm gonna do a quick command shortcut. I'm going to do Command J. And it's good to automatically cut her, cut, make the selection, and create a new layer on top. So now I have her as a new layer on top. You can also use a layering mass to make the selection so you can go back and edit if he needed to have everything selected. I can go down here to my layering mask, just do a quick layering mask. And I just master right there. I like layering mass because you can just delete the layering mask and then get the original photo back. So whichever way you prefer, and get my rectangle tool. And let's do kind of a, let's take a sample. I like taking samples from images instead just using black. Let's get inspiration, color inspiration from the photo itself. So let's get the eyedropper tool. Let's sample kind of one of these darker blacks, grays. And I'm going to get the rectangle tool and do the background and bring that down and learning system, it's a pretty simple so far. So let's use our condensed typefaces. So we have a lot of different choices. I have them all available here. So I can easily grab them, the ones that I supplied on the list. So let's kinda go through some of these are more condensed than others. So that's when it's not quite as condensed. The width is a little bit wider than the one above, but they'll have different characteristics and style. Some of them are kind of a thinner weight and some of them are lot more bold. And I want to go with the boulder condensed type, Joyce. So I'm gonna go with one of my favorites, which is Como. So como, and this is a, I think there's a version and there's a B version. We're going to use a. Of course you can use any font choice that you would like if you don't have access to Adobe fonts or you decide you want to use another condensed typeface, that's fine. You don't have to use this one. So what I'm gonna do is I'm just gonna go ahead and copy this since I already have it as a text. And I'm just gonna paste it in. We're going to type in our headline. Great for social media, of course, you could type in a headline. This is just something I had. So what I want to do, the first thing I wanna do is I want to collapse. I really want to unify this headline because we have this tight spacing between the characters and I would undo tight spacing between the lines as well. So tighten the letting a little bit. So it's gonna double-click my type layer. Let's change right here the letting. Let's kinda get a nice spacing. Just like that. That will also allow us to make this bigger, a little bit higher impact of a headline, which is really important. And so another thing you wanna do with headlines is kinda mess with maybe two colors. Because right now everything that all the words mean the same. They, they, they, they're not broken up at all as one big block. So what I wanna do is I want to maybe highlight the first two letters and make it a different color. And let's keep the top, kind of this reddish orange color. And let's go in the bottom. And I like to find inspiration from photos. So I'm just going to sample one of these blues maybe kinda that lighter blue. And that can go into my color picker and kind of make it a tiny bit brighter. I'd just love finding inspiration and photos because it all kinda goes together, all fields together when you're. Getting inspiration from the photo itself. So it has kind of cool tones and warm tones. That's what makes this photo unique. So perhaps I can kind of generate a different color here. And I don't want it to be so saturated plus kinda D saturate a little bit. So I'm gonna go kind of diagonal my color picker and go a little bit brighter. Just like that. It's trying to match that almost sunset color and then the blue color. Another thing I wanna do is make this feel layered. So instead of having the topography rest on top, this is why we isolated the, the woman. Let's bring the woman on the top so she covers the a little bit. Of course it could be multiple, you know, places just as long as it feels layered. And I could take that another level by adding a little bit of a shadow from her. We could either just double-click, get the Layer Styles Panel this do a drop shadow that casts at an angle just like this to make it look like she's casting a shadow onto the topography does changing the distance and the size is already at such a high level. Just like that, we kind of added a little bit of a drop shadow and change the angle so it shows a shadow casting this direction. And I can probably clean up that selection a little bit. And it wasn't the perfect selection. I would use the pen tool to clean it up if I want to do. So, I want to practice a little bit of font pairing. So we have this really bold, condensed, tight typeface. Let's find a Serif typeface to really pair well with this, to kinda tone it down. So we're going to have a little small subheading, condensed fonts. And let's make it a white color or maybe not even a stark white, but kind of a light gray just to kind of tone it down. Let's use a Brill display of Brill display. That's kind of a nice classic serif typeface. And we can even make this a italicized. I think that would be a nice touch for a Serif typeface. With social media, sometimes you have other little things to say. Some people also have their Instagram handle there or they have a hashtag that they're promoting or a share save like kind of information. That would probably be a kind of a good indication of like a little subheading You could put there. Let's duplicate this. Let's have like just another element. So we can almost make this like a template that someone can swap out what they would want to use. Let's do a number. Like maybe it's part of a series, maybe it's part of a carousel. Something along those lines and look at the condensed typeface. So I would normally never be able to put something that large. Two digits, two characters. I would normally not be able to fit it in that narrow space, but because this is a condensed typeface, works pretty well. And so what I'm gonna do is I'm gonna scoot everything over because that's really close to the margin. I'll like to have lots of margin around my edges that just looks more professional. So I'm just gonna kinda to select everything and just take my left keyboard arrow key and just tap it over. Kinda get similar margins if you really want to get detailed with it. I think I have my rulers outs and I've got my rulers on the top and my rulers on the bottom. I can click and hold. And I can get really technical in terms of my margins and get them to be very similar in width. But usually granting social media posts is, gotta be quick, quick, quick. So here we go. We did that really quickly. We're gonna do a couple more other ones here soon so we can practice maybe some outline topography as well.
7. Project #1 - Social Media Posts - Condensed Type - Part 2: I am back at pixels.com. I just typed in black background and the search and found another great one to use for social media, we can do it as a Jim motivation quote. So I have this black background and go ahead and download that picture and bring it in. It's already haven't in Adobe Photoshop. And we're going to isolate Hertz. The first thing I like to do, so I'm just gonna go ahead and double-click on Lockett and just do a select Subject and does this awesome selection algorithm. And I'm going to create a new art board. So all I'm gonna do is when I created the new document, I created an art boards. And so all I have to do is click on the top of the art board here. And I have the art board tool selected. And I'm going to simply just create a new art board. And it's gonna do the same. 1080. By 1080, I can continue to create as many as I want. I can even do a carousel. And what's great is if I do ten of these, which is the max you're allowed to have on Instagram and go to File Export as. And I can quickly export all ten of my carousel posts. And you can create really great templates as way too. But that's a whole nother project for whole another day. So here I am in our board. Tim's gonna paste what I had. I'm gonna do Command V. Go ahead and click on OK. Let's go ahead and try to think of a headline that we can put here. And I'll be right back. So I typed in just kind of a generic quote. There's no such thing as a wasted work out. We're gonna try to integrate this topography around the woman. And so this is just Helvetica, just kind of a default regular, regular size. And so when I make this larger, you can see how it takes up so much space. It's going to be hard to really kind of fit that and have enough space for her to be, to show her whole body. And so that's where condense typefaces really come in handy. So let's go back to our list. Let's go back all the way to the list i had. Let's find one that is fairly condensed, but maybe something different than co-move that's trying to find something a little different. Let's try this one right here. Let's type in that. There it is. And let's do bold. But may be black. Black is always the biggest size. Let's just kind of see here. I think that's gonna work, that's going to have the greatest impact. There's a lot of gaps there between the letting here, so let's tighten the letting. So I'm just using my arrow keys so I can quickly tap through the letting sizes. So see how the headline ends right here. And the Helvetica was creeping into the right side of the lady. And just a side note, you can collapse an uncollapsed these different art boards. So if all the layers start crossing over and you get confused, you can just collapse it art first art board over here. And you can just focus on the art board that you're working on, which is art board too. So we have our isolated already. We brought that in when we first started. So let's bring that on top of the typography. So we're just going to position it so you can still read the text. And this is where it gets a little bit tricky because you don't want to cover vital parts of the typography. So let me move this around. I can also, of course, I'd probably go back and clean up that selection a little bit, but let's go ahead and select her. Ann's gonna double-click and pull up the Layer Styles. Let's see if we can't just do a quick drop shadow. Let's change the angle so it's casted downward. And I think that's pretty good with distance. That's, it's saved it from the last time I did it over on our board one. And let's tighten up the size so it's a little bit more distinct. And let's just make sure we have equal margin around the edges just to make sure that we're not to close this way and it looks unbalanced. We don't want to have anything look unbalanced. They're just trying to find nice equal spacing. So let's bring into texture. This is something that's really screaming for some kind of texture on that stark black background. So gonna go and pixels and download the first texture. I see that I think it's gritty enough for a kind of this inspirational Jim quote. I actually ended up going with something abstract. So I just typed in abstract and pixels and I was able to get something like this. What he liked about it as had that gritty texture, but it also had different pockets of color. So it wasn't just a solid repeat kind of texture, it kinda had something different about it. So I'm gonna go ahead and download this and bring it in. I'm just dragging this right into the art board to just going to expand it. And we're just gonna do a blending mode quickly, apply the texture on top of the topography. But I don't think I want to cover the woman. So I'm just going to use a blending mode to quickly cover everything up, including the topography and when to give the type a little bit of greediness too. So I'm just in my layers panels gonna do blending mode. Let's see what kind of gives it the gritty look without overdoing it like that's kind of overdone. So I'm already thinking luminosity. And let's, that's gonna kinda keep it more of a gray that's going to kind of get rid of that color that was already there. It's gonna kind of desaturate it in a way. And I'm going to bring the opacity way, way down. I just want this to be a subtle texture just like that. So I use Luminosity 17% with that photo. Of course, I can drag that around to see kind of what I like about it as got kind of a lot going on here. This little stark over here. So I kinda like that different contrast in the background. So one thing I'm gonna do is some of the texture looks a little distracting on the woman. So I'm just going to bring the woman above the texture. So she looks a little bit more clean in the background, looks a little bit more clarity. I think I like that sense of contrast. So what I wanna do, and I do the slot in other projects, I do, I do this in a YouTube thumbnail project, but I like to take people, especially when you have kind of a high color contrast headline and make them black and white. So the headline color really, really, really pops out. So I see that I don't have this as a Smart Objects somehow. Maybe when I isolated the woman, it got rid of the smart object. That's no big deal. I can just right-click my layer. Convert this to smart objects. So if I do any kind of adjustments, it won't permanently adjusted, it'll still save the original file. That's why we do smart objects. So now that we right-clicked and made that a smart object, let's go up to our adjustments and lets us do a simple black and white. And we're just gonna go with the default course. We can always sit here and adjust certain colors and shadows. And we'll do that another time. So now that I did a smart object, now it has a smart filter and I can easily take this on and off, and it's very easy to go back to what we had. So I already did this ahead of time. I went ahead and change this to yellow. I thought yellow and black really helped make it pop. And I wanted to break up the headline. I like breaking up headlines because if this was all white, it would look very washed out. If it was all yellow, it would just be too much. So I think this kinda to tone look is a nice balance. And I think it's missing something. So I would love to add just a little pop of color. And when I think of yellow, a compliment color on the color wheel is blue, would if we add just a little hint of blue over here in this kind of blank area, blank space. So what I'm gonna do, I'm an art board. I'm going to create a layer on the very, very, very top. And I'm going to get a soft round brush. So I'm gonna get my brush tool. I'm going to make it pretty big, pretty big, maybe even bigger than that, maybe even 1500 pixels big. And I'm going to get a blue color and I can even borrow this blue color, maybe one of this blue color right here, kinda like how that looks. And it's going to get my paintbrush tool again. I'm just going to click once paint over. And I'm going to use, and I might even do a little bit of a darker, deeper blue actually. So I'm just kinda make it some adjustments, clicking once and I'm going to use a blending mode to be able to blend this in nicely. So let me go ahead and use screen. Screen is going to be bright. Little kinda leave it bright. And we're going to tone it down. So we're going to cut it in half the opacity. I'm going to cut it in half to 50%. So it's just not so overwhelming because why I goes directly to the blue background. Well, we don't want that. We want the AI to stay here in the headline. So let's just make it an accent and leave it right there. We can sharpen that just doing some last-minute adjustments, we can sharpen this texture. I love to sharpen textures. Let's give it that really high resolution look. So I have this and I'm just gonna go to Filter and already haven't saved sharpen. And I also like to sharpen my photos to just once, just a quick sharpen, kinda just mix it really. So you can kinda see a little bit more of the details when you sharpen something. So that's a quick one using condensed topography. If you did not use condense for that, that headline would look crazy. I'm sure there's some pretty cool opportunities to work the headline, but we're gonna move on to one more little project. We're going to practice doing outline topography. And it's really, really easy and Adobe Illustrator. So I'm going to pop into Adobe Illustrator. So let's say, let's go and create a new document really quickly. I'm gonna show you how easy it is in Adobe Illustrator and how in Photoshop, it's not exactly intuitive. So here an illustrator, we just type in outlined type. I'm just doing Helvetica bolts. So if I wanted to make this outlined, let's make it a little bit bigger. I just go down here, make a stroke. I mean, that's really easy. And I have my Stroke panel and I can add rounded edges and I can make it thicker. Like that is so easy to do an illustrator. But in Photoshop, you don't really have this stroke option on topography if you've ever noticed. So we're gonna talk about that next.
8. Project #1- Social Media Posts - Outlined Type: So this is the same photographer of the last Jim photo. We're gonna do a different one. This one I think we can crop to have a high impact on a kind of a square dimension. So I'm gonna go ahead and download this one. Let's go ahead and make it a little bit bigger. Let's go ahead and start to get this cropped. It's kinda have her in the center because it's such a great photo opportunity to center align is such a nice symmetrical photo. So let's keep it center aligned. And let's zoom in on her because we have a zoomed out image kinda lose the emotional impact. So with a lot of my projects, I liked it, zoom in when I can kinda have more emotional impact. So I'm going to have, what if this was you in 30 days, kinda like a 30-day challenge for the gym. What could you look like in 30 days? So here we're gonna go ahead and type that out. So let's go ahead and copy and paste. Make this a different text box. So let's hold down Option and drag to create a duplicate. And let's do the 30. And this is where when condensed topography, you might like the characters, but she may not like the numerals. So you might like the letters, but not the numerals. So in this case that 30 looks really kind of immature in I don't know why, I mean as a great characters, but the numbers does not like in the three. And that's okay, that's when we can go in and let's try Como CO mu a. That looks a little bit more sporty, I think in my opinion. Let's tighten the tracking just a little bit to kinda match the condensed version up there. And then I think that looks a little bit better. And let's duplicate this top Since we like letters and due days. So what if this was you in 30 days? So we need to figure out how to work this entire headline in. And there's a lot there, so there's a couple tricks we can do. We already are using condensed typefaces. So let's do outlines, an overlap, some things to kinda create a modern look. So to create outlined text and Photoshop, here's what you need to do. So I have this layer selected right here. I'm gonna go ahead and double click over here in the empty space. I'm gonna bring up my Layer Styles panel, and I'm going to click on stroke. And here is the trick. That's kind of not really intuitive. We gotta have stroke. So let's say we want to have white or maybe like an off-white outline. It a click. Okay, so what we need to do is get rid of the fill inside. So let's go ahead and we have our layer selected. We're gonna go down to fill. We're gonna go ahead and reduce fill, which is right here. We're gonna go ahead and bring it down to 0. And that will just leave the stroke. So if I want to change the thickness of the stroke, I just double-click it my Layers panel and I can adjust it right here. So let's say I want to make it a little bit skinnier. And what's kind of N is kind of a thin kinda stroke like this. A little bit too thin. You want to make sure it's readable. So maybe two pixels on this one or even 1.5. A lot of times I like to split the difference and it looks like it's not letting me. So I guess we're going to have to go with two on this one. And you can do inside, outside. Sometimes the outside could look really nice to kind of extends the thickness of the character when you go inside or outside, and then inside brings it in. And then the center just kind of splits the difference. So let's do Centre. And we're going to keep everything the same. And you can even save a layer style. So we go over this in courses, some of the stuff you've may have already heard before, but review is always really good. So I can save this layer style. So let's create new style and say outlined type. Click OK. So I save this and I have to do this over and over. So I can open up my libraries so you know, where can I load a layer styles? So I'm gonna go to windows styles. Let it there it is, right there it is right at the very bottom. So I can click on days and go ahead and apply the same exact style to it. So here's what I wanna do. Kinda overlap this. Let's put 30 all the way in the back. And let's put some color in this. Let's make 30 a different color. Let's go ahead and stick with the theme here. Let's kinda go with that same kind of sunset color from that side, I think the pink ads, so femininity, some softness to it. So you see when you have this outline type, I can now easily have readable. I can read all that. If this was u and 30 days, I can still see you and n, even though this is taking up almost all of that background last kind of the power of outlined typography. So now I can layer this and have this on top just like that looks kind of cool. And so I want to be able to integrate the woman into this a little bit more. So let's bring the type over. Give it the layered look. I can bring all this behind her. So she's peeking over and I can then add shadows to make it look like she's really in there. Of course it's outlined types. You're not gonna really see it quite as good as some of the other ones is changing the distance and the size there it is. You can kind of see a little bit of a shadow peeking through there. And once again, let's make her black and white. So let me make sure she is a smart object. Right-click smart object. Let's go and make her black and white. You don't have to do this to every photo. I just like how suddenly if you take the color out the 30 just like really pops out at you. That's why we're doing it. It's to make sure we, as designers, we're the ones who control what the viewer's eye focuses on. So we are in total control. So we can always take color out to bring emphasis on other areas of color. So you can changes how every you want. You can pair a outline type with a filled in type, and that can work really well. So you can arrange this however you'd like. You can use a different photo when you do your project. I want to go ahead and borrow this texture. I already kinda like it. So let's just bring it on over. Click on our board three and just pasting it in. And I'm going to put the woman on top because I want her to be nice and clear and crisp. And there we go. There's our kind of background texture that we can bring in. And there we have it. We just created three social media post. Some that use condensed fonts and some that use outline fonts and kind of styles and characteristics as well. So I think this is great, it's very practical trend. I see this a lot just since coming up with this trend are really kinda picking this as a 2021 trend. I've seen it everywhere in social media. That's already been in use for awhile, but I just think you're gonna see more of it because it is kind of a useful. As you can see, it's very useful for packing in a lot of inflammation. Instagram Really Loves Saves instead of likes. So people save content that's packed, has lots of content in it. And if you can find creative ways to work in helpful content or quotes or whatever, it's going to be helpful. So you don't have to use all caps a used all capital letters for these headlines. You don't have to do that. You can do whatever you want to just kinda giving you some tools and some practical projects to use to make your designs not only look more modern, fresh and updated, but also practical.
9. Project #2 - Frosted Glass in Adobe Xd : Welcome to Adobe XD. This is where we're going to be able to create this frosted glass effect very quickly and easily. You can still do it manually and Photoshop and Illustrator, but you have to have lots of different layers and effects and it's just a lot to set up and really hard to do because there's not this kind of automatic setting where you can easily create its effect. So that's why I wanted to be an Adobe XD. I teach several Adobe XD lessons. I have one of my digital design masterclass where we'll go over all the basics of Adobe XD and how it works and how to get animations working. This lesson we'll mostly focus on the trend and how to create this specific step. We're not going to go over the basics of how to use Adobe XD, but we'll be doing this little quick project to show you how easy it is to create this frosted glass effect. And we're going to also create a few quick little user interface items like a slider and a button or to that emulates this more glass morphism effect. So let's get started. I wanted to get a nice high contrast background color so we can kind of see how our frosted glass affects the background. So I have this really bright yellow flower. I got this from grew. It's on pixels.com so you can download that photo if that one's no longer available. There's a lot of great photos that have a similar look. I just typed in black background and you have lots of nice high-contrast colors, high-contrast background images to use. So I'm going to bring that and Adobe XD less is opened up just a default document. Let's just go ahead and do web. 1920 for announce. That's going to be 1920 pixels by 1080. So it kinda more of a desktop size for now. Let's bring in our photo. And I just drop it right in. So this will be our background element. And so this is how easy it is to create this. I'm going to just get a shape. Let's go ahead and get a simple square shape and draw it across. Almost like a credit card shape. If you ever look up glass morphism, you'll see tons of examples of frosted glass credit cards for some reason, people love to do it to credit cards and credit card designs. So I'm gonna go ahead and just click on this and just kinda around the corners. Not too much, just a little bit kinda staying a little bit more sleek and modern. And this is how easy it is. So I'm gonna go right over here to my right panel. And I'm going to go down to background blur. I'm going to click on background blur. Look at that with one click. I can go ahead and make this frosted glass. What's great about this that other programs in the Adobe suite do not have as I can click and hold. And all the sudden, once I click and hold, I can does alive blurring effect as I move it. Which is really cool, really incredible to be able to have that so I can turn this, spin it all which way and it'll go ahead and keep that frosted glass effect. In other programs, you have to do this manually, creating a letter layer behind it and then blurring it. And then you can't just sit there and just move things around in an automatically change it live for you. So that's why we're in Adobe XD today. So when you go down to background blur, you can change a few elements here to change how the frosted glass appearance looks. So you have blur amounts. So if we reduce the blur, it's gonna make it more sharp. So as you reduce the blur, it gives the glass less of the frosted look. So if, if if the glass is just a pure glass, you'd probably just have it at 0 if he wanted to be super-duper frosted like you would see in a bathroom window that would be frosted. You'd have that effect too. So you can change that appearance. I kind of like something in between. I do want to be able to see the elements on top. You want to be able to have everything remained very readable. If you have a low effect, you really have to have some high contrast type and elements that really pop out above it because you're not gonna be able to see it through this really detailed photo. So I'm going to have it somewhere in the middle. Let's say about 20 for now. And we can also change the brightness. So it can make it a super bright, almost like there's a light behind it. And you can make it dark. So let's say you're doing kind of a dark mode UI or a dark mode interface. If you reduce the brightness to, you know, you can go all the way down to negative 50 if you wanted to, but we're going to do something right there in the middle. And then there's affect opacity, which is the last option. So this is going to, as you increase it, because all the way to 100s, basically the effect is null. It's no longer working or you can have the effect at 50% power, I guess you should say, or 50% strength or all the way at full and it's at 0, you don't have any transparency of the effect. So it's, the effect is fully on, so we're going to leave that at 0. And what makes glass morphism work really well is, you'll notice when you see it out there, you'll see kind of a border around it, kind of like a light color stroke. I guess you could say that kind of gives it more of a beveled glass edge. If I did not have a stroke on hearing, gonna go down here and click off stroke. And Adobe XD, it's called border, but it's basically a stroke. I take that off. It kinda gets lost. It gets lost a little bit. When light hits glass, you'll have, especially when glasses cut, you'll kinda have a little bit of a shine, a reflection on the edges of glass if you ever look at a cut piece of glass. So you want to add a little bit of a border and you wanna make it a little bit bigger. So let's do two. And usually I like to make it not white because then that looks starts to look fake. Something kind of like a light gray look. Very easy, very quick to use. We're gonna do something a little bit complicated. Next, we're going to take it up a level and do this really quick mobile app UI elements. We're just gonna do a couple of borders, couple of sliders. And we're going to add a tiny bit of animation. So you can have something really cool to put on your portfolio.
10. Project #2 - Frosted Glass in Adobe Xd - Part 2: So before we start this next project, I wanted to let you know you can download a vector file of this phone that we're going to use. So can quickly just create kind of a placemat or a place setting for our mobile app design so we can present it nicely. So you can have access to this vector file. I have two different files and the downloadable resources, I have a dot EPS and I have a dot SVG. So SVG is a special vector file. A lot of icons are created using SVG so that browsers can manipulate the vector and scale it without distortion on browsers and icon, icon sets and all that stuff were designed it. But SVG is a great file format for Adobe XD. I can open up Adobe XD and I can drag this right in and it's going to start to read it. So you notice you can open up the EPS in Adobe Illustrator or the SVG. You can just drag this directly into Adobe XD. This is true for any SVG file and look at that. It's already in there and editable. So this is what we are going to be creating is this project right here. We're going to just create a couple of glass elements, kind of show some frosted, show it on frosted. We're gonna be creating some triangles so that we can have something high colors. So you can show off this glass morphism effect. We're not gonna need any photos for this. So let's get started. Let's open up a fresh new document. Let's go to File New, and let's go ahead and do a Web 1920 just because I want to create kind of a more presentation kinda style. So I'm gonna go ahead and open this up and have some room for background elements. And we can bring our phone, right? And I'll just show how I did this again. All you have to do is drag that SVG file and any kind of icons or vector graphics and SVG can easily be dragged right in here. You can always right-click and Ungroup if you want to be able to have access to one of the elements like this is the background picture. So what I wanna do is I want to have lots of bright pops of color. We talked about color trends being highly saturated hues, bright and vibrant. Let's try to do kinda some deep purples and then do some high-contrast yellows may be for our triangles like you saw in the example. So what we could do is we could OK, go to fill. And instead of just a solid color, we can add a radial gradient. And let's do some cool purple tones. So we're gonna take purple and bring it all the way down to make a deep purple. I'm going to select the one on the right. Make it a little bit lighter, purple. And I might need to switch the position of these. Let's click on this little brighter and then go here and go deeper. So we want to have the lighter in the center of the radial gradient. We can of course, make that compact or make it extended. Whatever look we want to go for. So simple gradient added, let's get some triangle shapes so can show off the frosted glass look in the background. So I'm just getting a triangle. I'm going to hold down shift so I can get a nice even triangle. And I'm going to take out any type of border. So borders are defaults, so just make sure to go and uncheck the border. And I get a relic. Everything nice and rounded to nice rounded when let's do a nice color, bright saturated color, a good contrast to purple is yellow. So let's go for a bright yellow. Maybe add a tiny bit of orange to tone it down so it's not so, so bright. So there's our first triangle. Hold down shift and make it a little bit bigger. Hold down Option and drag or control, I believe it's on Windows and drag. And you can create a second triangles changed kind of the angle. And let's make this a different color. How about orange? So we have our two little triangles so we can see our frosted glass effect. So let's create kind of a logo in the centre. What's gonna circle? Hold down shift so I can create a nice even circle. And let's apply our glass effects. So let's put our triangles here so we can see how the effect is being loaded. I'm gonna go down here to background blur. And just like that, we have a cool frosted glass effect. Let's change our border to a little bit lighter color, but not white, just kind of a little bit of a light grey. And let's see if it allows us instead of one CIF, it allows us to split the difference because I think that might be a little bit too thick. It's, let's do 0.8 instead of a one. Does allow us to do partial number, so that's good. So let's reduce the blur a little bit. So I'm taking the blur, which is the first option and I'm just going to bring it down. I want to be able to still see the definition of the triangle. If I do that, then it's hard to really tell what the shape is through IT. I want people to be able to see through to the background elements, but also make the text readable. So it's a really delicate balance. So let's do right now, let's just stick with 14 and see how that looks. The brightness. If we want to have a dark UI and have a dark background, we can do that. And let's have it be bright because I wanna put maybe some darker text on top. And if you ever have problems with readability, you can also increase the transparency of the effect so it kind of slowly fades away. If you ever have issues with readability, you could always put like a dark grey or black text on top that would be super readable. Or if you want the effect to really be in full play, you can bring it down to 0. So you got three different options to tweak this quite a bit. So let's add our texts. Let's take her text tool and add a little some words right here in the frosted glass circle. And so there's two ways to make text. You can click and drag and make kind of a textbox. Or you can just click once with the Type Tool and have more of a headline type that doesn't have the textbox that collapse. We want to kind of keep it in a circle. So let's do a text box. We're going to click the type tool click and drag to create more of a paragraph style textbox where it collapses just like this whoo. And then we can kind of cut this a little bit. Glass more. Visit him. You wanted to kind of cut or you see syllables, so glass morph ism. So that will probably cut better than cutting it here where your say glass more, more. Sufism. It doesn't make sense, but morphism, you could probably get away with cutting it. Ok, so there is that position. Let's see what we need to do to get this to work so we can even do it on topography. You can do the background blur to give it a glass effect as well. So we're having problems with having both be frosted glass elements because now I'm having a really hard time reading it. So let's edit our settings on our circle. So let's bring it down to seven for blur and 12 for br rightness. That'll kind of help everything pop out a little bit. And for the type, we probably need to lessen the effect. So now we have the topography selected. So let's settle on 14 for blur and 41 for brightness. And another thing I wanna do is I want to bring out, I'm going to start making this presentation. Let's copy this background shape. And I'm just gonna make it all the way across the background. Just to kind of give a little less contrast between the background and the design. Here we go. So now you can really, really, really focus. I'm just continuing to make small adjustments. I just changed the position of the triangles and just trying to find a nice little fit for this layout and just added the background. So let's add some more elements. Let's practice making a button. So up top we are going to get square tool and we're just gonna make a simple button size. And we're gonna slightly rounded, not much, just a little bit. And we're gonna do our background blur. And let's change our border to white. And what we're gonna do is instead of having this white border. So we can select our button, click on border, and we can make it a 50% opacity. So it's not like a solid full color. It kinda let some of the color, it's transparent as well. So that kinda helps with the realism of it. So all he did was went to border. And then you just, this is kind of how you change the opacity or transparency. So we have a button, it can have the same frosted glass effect up there as well. So we can go ahead and copy and paste this text here and type in button. And maybe the strength, maybe not extra bold, but let's do regular. There is the button. Let's do this one with just a border. So we are going to click off fill and just have a border. And then we can bring that up to kinda show what that would look like. We can also do a different level of frost stateness. So I can click back on fill if we wanted to and we can kind of make it less frosted. More frosted, or also change it. So it's kinda like a darker color. Lots of options we can do there. So let's create some more effects. So let's do a sliding bar option. So let's get our rectangle tool. We're going to just make a pill shape. So we're going to bring it all the way to a pill shape so we can change our border. We can make it semi-transparent by making it 50% capacity. And we can do our background blur. And let's make it a little bit skinnier. That's like that. So that'll be kind of our slider. And let's make the slider component or the slider. Button. Let skip the square tool, and let's make a button that will fit nicely right in there. And let's not have too much leftover space. We can do kind of the same settings, 50%. We could do a background blur on this. And when it comes to the slider, you wanna make it really stand out a lot because you want people to be able to see it. So let's change the border so it's not gray. But let's keep it at a full opacity so you can really see it better. So let's adjust the settings so it's a little bit brighter than the slider underneath. You can even animate this, so can slide across and make this border a tiny bit thinner. Sometimes you have to type in something manually if it's lower than ones and maybe 0.8. Let's do some bars with color indicating a dollar amount. So let's first do our dollar amount. I'm just going to do a text box and type in. Let's say it's for a money management app. Let's type in kind of a generic number list. Make sure my spacing is set to 0, tighten that up and make it a pretty bold typeface. Let's do extra bold. Let's make it a little bit bigger. Of course, you don't have to use the exact numbers I do. You can just experiment with sizes. And let's give this a frosted glass log two. Let's do a very thin border on this. So we're gonna click on border and we have a 0.5 sets. So that's kinda the half, half of half a full point. And let's do background blur. We move it over to our triangles and kind of see how the effect is looking fairly good. And let's go ahead and have a pretty low blur. So the final settings for this is 14 blur and 41 brightness, that, that had a nice readability even when you had it over the triangle. And we might want to lessen the border a little bit, maybe kinda make that a little bit semi-transparent. Let's try 50. And I think that looks a little bit more realistic, gives you a little highlights on the stroke, but it doesn't look kinda fake either. So let's add some financial elements. We have a number, let's have kinda some chart bars to denote a graph. Just kind of playing around here with elements. We're not doing any kind of serious UI brainstorming here. We're just kinda showing how this effect work. So just creating a series of bars. Let's go ahead and get this setup for we duplicate. Let's do a background blur. Let's get the border just kinda what we've been doing. You know, 50%. Let's reduce, let's make it a White. And let's reduce the size may be 8.5. And let's make it slightly rounded. I just want around the top and the bottom. Let's hold down option and click just to isolate one corner. Pulldown option or control if you're on a Windows. Let's see how the frosted glass effect looks. Let's create a rectangle that's really bright green, like maybe a lime green that indicates money and growth. So let's do a fill, it's get a bright green going on. And let's not have a border on this and let's make it rounded. We're just kinda have a background element. Let's get a run through. This is going to be behind, so we're gonna put it in the back of the layering system. So command left bracket is going to bring it behind in the layering system. And so now we can see how the frosted glass effect flux. So let's bring down the blur is in kinda see the background elements a little bit. So it kinda gives it more of a glassy look. So we only have three in terms of blurring. In terms of brightness. Lets make it nice and bright. Let's keep to 20 or 18. We're not going to change that affect too much. So let's go ahead and hold down Option or control. And let's change the graph. And so you can notice when I click and drag, it's going to automatically snap so that everything is equally spaced, which is very nice to have. So you can also easily animate this too when we get to the animation. So it's kinda move some of these elements around, kinda bring it up.
11. Project #2 - Frosted Glass in Adobe Xd - Part 3: So here's our project so far, just added a few other elements, but I think this looks great. We can position this. I made this to show off the frosted glass effect, just kind of some random elements. This doesn't really mean anything. It's not really a design per se, but just kind of a collection of elements you can show off. So let's do animation because this looks okay. You can really see the frosted glass, but frosted glass looks really great when you can have movement and kind of show how it changes live as you move it across. The always looks really cool. So let's go ahead and animate this. So I go over animation and all the stuff and some of my other classes in detail. So we're just gonna kinda do some very basic stuff. So what I'm gonna do is I'm going to take this art board right here and I'm gonna duplicate it. So I duplicated my art board and I'm going to go up to prototype. So this is design mode. That's why do all my design work. Over here is prototyped mode. And this is where you link everything together and make it like a live, workable site that has animation. So this is going to be super-duper basic. So we're going to select the art board, the first art board, and we are going to link it. So we're gonna take this little icon right here and we're gonna link it right over, can look in anywhere on the art board is going to link up together. So when you go into this link and you have to be in prototype mode to be able to see this. We are going to be able to select that link. And we're gonna make it auto animate. That's how we're gonna get the animation to be nice and smooth auto animate. And so right now we're gonna go down to easing. And let's just try for right now I love the way ease in and ease out work so easily as an animation that's going to slowly start the animation and slowly end it. So it looks really smooth. It doesn't look very harsh. So that's all we have. That's all we have done so far. So now we've got to have, we have two different states. So this is the first state and this is the second state. So it's going to start off in a certain way and it's going to end up at another way. So what we're gonna do is we're going to change and show how it's going to animate. So I'm going to show you an example. I'm gonna move this triangle. Let's go back into design. You have to go back into design mode. And I'm going to just turn this triangle just to show you how this works. It's all I'm doing. Right? Just moving things around here. That's it. Just move the two triangles. You go back to prototype mode. We're going to play this out. We're going to select this first art board. We're going to play it and it's gonna go from this state and it's going to animate it to get back to that original state. So let's click on play. Let's see what we have. We're gonna go ahead and click and you can see it animate. And we don't have it connected back. So just animates once to that state and stays there. So you can have it cycled back. So I have the second one selected. And you can see this little arrow. You can actually go back to the first state. And you can go to type, and you can go down to previous art board. So what it's gonna do is on the tap, so that's the trigger is you click. It's going to cycle right back to the previous art boards. So you're basically making a loop. So you have this state that goes to this state of animation, and then you have this connecting back to the previous. Bored, and so that seems complicated, but have some lessons that goes over animation in Adobe XD to this Play icon right here. Let's play it out. And right now the trigger, which is how you start these states is a tap. So I have to click my mouse, is gonna do the first one. I'm going to click it again. It's going to go to the previous art board and snap back to make this where I don't have to tap it to make it time initiated and not just tapping. We're gonna go up here to trigger. I'm on the first art board and let's just have it start on a certain time. And it can start right away. So 0 delay, and that's it. And it can make the duration a little bit longer the animation. So we can extend that out right now. It's like a third of a second. So we could do a full second to make the animation more lengthy. And we're going to click on the second art board. And we have the cycle back option here. So instead of tapping, we're going to make this a time as well. And it's going to be immediately. So it's gonna go from one state. I'm going to click on this so you can kind of see what I have here. It's auto animate. And then we have the second state. And we dragged it back around. And it is previous art boards is could a should be just one cycle, I shouldn't have to touch anything because the triggers now just time. So I'm going to click on the play button. And let's see that automatically starts playing. It goes from one state, it goes back to the previous art board, goes to one state. So you have this kind of cycle going on of animation. We can of course animate more than just the triangles. Now and go to this first state and weekend because everything's going to end up at the final layout that we have. So we can change this, anything really. We can change the buttons. And we need to make sure we're back and designed to be able to make any kind of movement or changes. Prototype modes just for linking things up. So we can have the buttons go like this. We can have our slider go back and forth. So all we have to do, I'm gonna hold down shift and drag just so it stays in line. And I'm going to bring it all the way over to the front. And let's change all of these to, let's make it look like they're going up and down. Right? So you can really see that frosted glass effect. And we can make this even more dramatic of an animation. So we just changed some more things. We're not changing the state, this is the state that it's going to revert to. So let's click on the first art board. Go up to our Play button. Whoa. So you can see that's pretty dramatic with the buttons. So I can just toned down those buttons a little bit. So let's go back. It flipped it all the way around the other side. I wasn't expecting that. So perhaps we can instead of flipping it to the left, let's do the write. Don't know if that's going to change anything, but lets click on play. There we go. That's a little bit more smoother. And of course we can make it even a longer animation if we click back here on the top of the art board name, and we need to make sure we're in production. It's hard to remember sometimes to flip back between. So I'm gonna go to prototype mode to make any edits to the animation. And if you ever wonder like what my connections are, you can click on your name. Your art board is going to show your linkage. And I can click on the top and move my art boards around. And it might make it easier to see kinda the transition. So this is a transition and this goes right back. So I'm clicking on the first art board and right now I have two seconds, but you can type in anything you want. You can make it be two seconds instead of 1 second, and we can play it out and see what it looks like. It's a little bit slower, kinda looks a little bit nicer now that I slow down the animation. And what's great is there's more than just one type of animation. There is 0s and 0s out, which is kind of what I like to do when I do video editing. I use a lot of 0s in ys, ys out. It's just something I almost always do with all of my elements when I do video editing and video editing software, super-duper popular format, but they're snap, windup bounce. So if we do balance, it's going to have a little pop, a little bounce to it. So click on play. So see how it has that little bounce. So all I did was change the transition. Kinda like bouncing. It's interesting, I wish you can change the bounce strength. I wish it wasn't so bouncy, but maybe in future updates, Adobe XD will add more transitions, are more animations. So this one's wind up. So it's kinda, kinda wind up. It's gonna go faster in the middle of the animation and slow down toward the end of the animation. So that has a really nice, almost like a ticking clock kind of motion. It's really nice and calming. Alright, so let's, let's keep it on windup. I kinda like how that looks. So let's play it one more time. What is great about Adobe XD? I can share this link with other people if I wanted to have it on a portfolio. But what I like is this ability to capture a screen capture. So I can click up here and I can record a macro to record this because I'm currently recording my screen. But if you click on that, you can record this. And that's how I made the preview video for which you saw about the class project. As it just recorded this, you can pop it on Behance.com and a portfolio website. You can do all sorts of stuff. You can create this. We did this one in 20 minutes. We were able to create this effect and can even spend more time and do like a real UX UI case study and design an entire mobile layout if you want. But just wanted to kind of showcase the glass morphism, frosted glass look. So hope you enjoyed this quick project and that you can really start looking into design trends for 2021.
12. Project #3 - 3D Typography - Part 1: Welcome to Adobe dimensions. This is Adobe's answer, too easy to create 3D objects. And now 3D topography, which is our big trend for 2021, is hyper-realistic 3D topography. So we've created 3D objects in Photoshop before in lessons, but we're going to take it a step further. And to Adobe dimensions. I teach the very basics of Adobe dimensions and how to work with 3D objects and software in other courses and other lessons or not going to focus on the basics of Adobe dimensions, we're going to focus once again on the trends at hand, which is how to create really realistic 3D topography. So I thought the best thing to do is give you a tour of some two different 3D topography projects. I did. And then we're going to create one ourselves using the software. So you can see this is the file I have for my 20-20 one cover photo I have for the course and for the lessons and how I advertised by 2021 design trends lessons. You can see this is where I created it. It doesn't look very exciting right now, but this is kind of when I press the render button, which it then renders the final lighting and refraction and affects. It looks a lot better after that, but before that when you're in the software, it doesn't seem too impressive until you get it rendered and you can see all those effects really happening. I think one of the hardest things about learning 3D software for the first time is getting used to the two different ways to move around a 3D space. And that is moving the objects themselves and then moving the camera angle. So there's two totally different things happening. If a camera angle, it didn't, you have the object's position and angle in a space. And both of those are like two separate things. I've found that to be the hardest thing to work in a 3D space. So when I go over those basic lessons and that other course, you know, I kind of go over how to, how to kind of move. These are kind of your movement tools and these are kind of your object tools. So this is how you move objects. So if I press the Select tool, I can take this number two and I can move it along 3D space so I can move it on the z axis, the x axis, move it down. And of course, in 3D, you have a y of three different axes. You can move it so it can move it forward, side, all different kinds of ways. And then you have that's all your movement Tools. And then you'd have all your camera angles. So camera angles going to be different. It's not going to change the position of the 3D object. That's gonna change your view the project. So if I have this as dolly, so I'm going to Dolly out. So if you're used to camera stuff, it has the same terminology is camera work. So we're gonna Dolly out and can see the entire art board here. And then I can orbit. So I'm just going to orbit around. And this is how you kind of set the angle and the view of your final render, which is sometimes just as important as the objects themselves is the angle that you have of it. And then lastly, we have pans. A pan is going to kind of pan around the object. And in this case you can see how it's not super duper, duper complicated. How I created those numbers just give some effects and materials and lighting on some numbers. We have a couple of default little shapes that come free with Adobe dimensions. This is a little tourists shape right here, and then we have to sum squares. So that is kind of how I created those letters. I'm going to show you one more. And the reason why I wanted to show you a couple of finished projects to show you how approachable and easy 3D topography can be, especially in Adobe dimensions, which I feel like a sole, much more simplified and easier to use than blender. Blender is great, but it's gonna take hours and hours of practice to learn blender. It really only think about Adobe dimensions as there's not the ability to animate like Blender has. This could be static three, so this is the topography poster that I created here. It's just got some gold material. All of these letters are individual letters. So I just used this type tool right here and dragged in some text and typed in one character at a time. And I was able to kind of stack them and have different depths so that when you bring them together, they kinda hug each other. And it's really very similar to flat typography. And flat characters is the same thing I would do in Adobe Illustrator, but I'm just doing it in a 3D space. So it's not really too intimidating and putting in the right material and lighting effects that adds a little complexity. But overall, the way on balancing the characters and the spacing between the characters is just the same as flat 2D design. You're just bringing in that extra 3D element. And when I dolly out, to Dolly out, you can see I put everything in this little box. And what that does is it gives it a background, it gives it a frame so that it's not floating in a whitespace. So that's the only reason why I put in that box, and that's just a simple shape. If you go down here, you have some basic shapes is your starter assets. You have some basic shapes you can bring into your 3D space. You have some models. And this is just a hollow cube that I brought in and then change the material and kind of put it almost like a photo box, like you would when you're taking a photo of something in real life, have control, the lighting and the environment a little bit better in that little box. It's not an object floating in space. So let's create a new document so we can really get a handle of 3D topography. So I'm just gonna go to File New and this could open up a new 3D space. So here's our default 3D space. We're just going to focus on text, this text tool, this is brand new to it. And I think in early 2020. And this is why it's a trend now because it makes 3D type so easy. So we just brought it in to the 3D space. And we can move this around and move the arrows up to move the object along the 3D space. We can make it smaller by adjusting this squares here so we can scale. So this is movement, the little cone here. And the squares along each axis is sizing it. So we can kind of scale it, make it smaller. And mu, this is probably the hardest part about working in a 3D space, is really getting to know how to scale and move your objects. And so to move it, See this little circles. I'm going to be able to rotate. So the circles are rotating, the squares are scaling and the cones are kinda moving along the axis and the line. So there's kind of three different little elements that you just have to kind of get used to do this a little bit in the lessons. And if you ever want to get it right on this baseline grid, you can click the middle and that's good. Align it to the surface. So right there's the surface of my 3D space. And of course we can change the camera angle. We have a couple of options. We have Orbit, pan and dolly. So these are all going to do something different doll, he's going to bring it in. Orbits, could orbit around. You can go all the way into the sky. And you gotta use a combination of a couple of these to really bring everything together. So let's go ahead and type in our type. So I have my object selected, just doing the Select tool. And I'm going to go down here to my text and just type in order to 2021. And I want to do a different effect for each letter. So I'm going to type in two and I'm going to scale this, make it bigger. And then I'm going to move it along the axis right here. And there is two. And right now it's on aerial. We don't have to use Arial that I know everybody I know we'll have aerials, so I might, might stick with it just because I know everybody will have access to that font. So let's just keep it to aerial. Let's keep it on regular. But if you ever wanted to change the kerning, the spacing size, all that's right here on this area. So what I like to do is I'm just gonna copy this to begin to do Command C, Command V and copy. And what we could do is we can kind of change the cameras. You gotta change that camera angle often to kind of get a perspective you like. So you can be able to move this highlights. So I'm going to move along the z and it's going to move it kind of diagonal and the diagonal position. Little bit awkward, that's OK. And what I'm gonna do, and this is the cool thing about 3D topography. You can have it layered. So in flat 2D we layer things by adding shadows and other things. But this, we can literally layer this thing and have them on different planes, which is really cool. So we can do like 20. And then we can duplicate this and then have this BY 2021. We can layer this on top. So i'm gonna bring that over, bring that back. Just trying to find the right position for this. And then duplicated again typing in one in the text box. We want to make sure that one is readable. So let's make sure enough of the one is visible that you can read it. What's cool is I've seen it like the example I showed about 3D topography, where you can have things kinda coming together. You don't have to have them all in the same plane going across. You can have things angled. So let's say we have this two or this two and the one that we can bring this one forward, we can rotate it on a different plane even so, I mean, just, you gotta really thinking it's, it's a totally different space to kind of think about. And then you can, of course, orbit this and get so you can see how you can create some pretty cool stuff. I'm gonna go back to what I had. Can always change the angle slightly, kind of give it more of this. Broken up looks so that I'm just taking the Move Tool, selecting each letter, just doing a little rotating. And what's cool, it's gonna catch light at different angles to, so if I have this at a different angle, it's gonna catch light differently than the other angles, which kind of gives it a dynamic Look. We have three axes. So we can even do a rotate x, rotate x, it can be flat down. I mean, you can do everything you want here. With 3D topography. This is what's so cool about it. Is it so many endless possibilities? And we can bring that up. We can even have that be floating if we wanted to. So now we can apply certain effects. So what I wanna do is I want to Dolly and a little bit frame it a little better. And I'm just gonna do my panties and just my camera tools. I'm just going to do the camera. I'm gonna go ahead and save it. And what we're gonna do next is we're going to be able to apply different materials to this, to really make this a set of flat being mat, we can really apply lots of different materials and even do some don't bevels.
13. Project #3 - 3D Typography - Part 2: So let's talk about bevels. So this is a new type tool added in 2020, is you go ahead and select your object and you can scroll down and you have this little bevel option here. I'm going to go ahead and toggle this on and it's going to add a bevel. And there's a lot of different bevel effects that you can do, kind of a classic one. And if you've done layering styles and Photoshop, these are very, very, very similar. You have more of a smooth around, looks almost looks like this nice smooth edge. You have convex step. You can kinda cycle through these. You can see how this one almost gives kind of a border which looks really cool and you do like a metallic border and square. So for this one, we can do a couple of different ones just to have different looks. You can change the width so it's not as prominent. You can make it super prominent. You can make it just a settled bevel. You can change the angles to make it come out or make it come in. I did a lot of the stuff with my 20-20 one graphic I showed you earlier. You can even repeat the bevel So you can have 234 and make it really detailed. You can even change the space which matters when you have more than one bevel. You can add space between the pebbles like this. So that's super neat. So let's go ahead and I'm just have the Move tool. I'm going to select the o or the 0. And let's add a bevel on this one too. Let's do a different one. But I like the round look so I can change the width. So let's move on to number two, the second number two, let's maybe do a classic bevel and change it. Let's get to really push it out. Isn't that right here? Look at that. It's flat and then it pushes out as I change the angle, kinda pushes it. So let's do that. That's interesting. Adding the repeat ads all those little different layers. And let's make it more space between the two. Okay, and now let's make this one smooth since those are both sharp. Let's make this smooth. Let's do a nice around, let's do a around outline. Or we already have a lot of outline's going. So let's just do another round. Just like that. So that looks great. So a couple of things we need to do, we need to put this on a background because right now it's literally just floating on white. So I like to put a material around it similar to that, almost like a photo box like I showed you before, just to put it on something. So we're gonna go, we're gonna go ahead and zoom out. We're going to zoom out, which basically are Dali tool. And we're going to zoom out and we're going to orbit around so we can go ahead and get this into a box. So let's, we can do that by creating a couple of planes. So we could put this on a surface. This is our plane and we can of course scale this, make it bigger. And we can build our own little box around it and do different materials. Or sometimes like a quicker way to do it is I like to use the cube. So I'm gonna go down all these, come free with Adobe dimensions and have this hollow cube. I'm going to bring in the hollow cube and I'm going to fit all this inside. So I'm going to need to make this a lot bigger. Scale it and then I'm going to rotate it. And kind of be able to put all this in a box. Just kind of as a super quick to do, may not be the most efficient way, but you know, it works. Let's scale it so blocked too much light from the global lighting, which we'll get to in a sec. And I know this is a lot if you haven't ever been in dimensions, Dolly out and then just continuing to make adjustments to this. And there we go. So got the whole box here. Let's take our numbers. We're going to have to Dolly right back in. And then we are going to have to take all of these little objects here. So lets just hold down shift and select all of our objects. It can even go up to object and group all these so you can keep these as one kind of object. And now we can kind of put it in the space. So now it's somewhere. It's not just floating around. And so I'm just taking the camera tool, kinda getting the right cropping or presentation. Now the only thing missing, and let's take our little box here and I can rotate this box and give it any kind of angle just like that. Oops. So now what's really going to make this come to life is the material and the lighting. So let's get to materials we have here in our starter assets. We're going to go all the way down to materials. There's a lot of materials we can use that are all free, that are already loaded with Adobe dimensions. We have coppers and golds, and marbles and wood and all sorts of different things. And at this point when I get to materials, I like to do prerendering. So prerendering isn't kind of a new option to Adobe dimensions within the last year. But you have a, a render Preview right up here. I'm gonna go ahead and put it on. It takes up a lot of computer resources. So this is when your computer might slow down a tiny bit. Mine does. Okay. But you can kinda see what it'll look like when it renders. So you can toggle it on and off. So if you want to really do major movement and moving the camera, you might want to have it off, but if you're ready for materials and to really see how the lighting looks, I would suggest putting on your rendering. So that's before. And then here's a pre-render. You can really see how the lighting and everything is going to look. And it takes a couple seconds for it to kinda work. But that's kinda already looks a lot better when your indirect. So you're not in Preview mode. So now when we drag and materials like ice, we can just drag that right onto our number. And we can change it to look like ice. And you can see how it's kind of showing through those different materials. Of course, that this box, this inside of the box can change to, we can bring a glossy which is kinda one of my favorite, kinda default. Looks here, glossy, it's gonna be shiny. That's going to reflect light a little bit better. You can also do like a black box. So all this is going to affect your lighting and how things looks at the black box is really going to let that glass look through. You could do lots of different, I mean, there's just so many different things you can do. What's really neat about Adobe dimensions is you can apply different materials on the same type character, so we can put a different material on the front, a different material on the back. So let's say we have this as, as all glass. And so what we did is we dragged frosted glass or right over on number two, and it became frosted glass, which is really cool looking. But we can even add a back to this so it can be incredibly complex. So for example, the one that I did, I had kind of a glass inside and a back, but I had kind of a gold outside or they call it the bevel. And so you can kind of make a really dynamic characters. So let's say I want to add a gold bevel to this. So all I did is I selected the object whenever. This kind of like your Layers panel. So this is text too. So let's go ahead and just title this first two. So we just know which one it is, has a little arrow here. This is where you can edit a lot of the characteristics of the character. And you have four different sides. You have the bevels, you have the back, you have the face, which is the front. And the sides. Will say I want to add a different material to the sides of the two. I can bring in brass and instead of dragging it on top, I'm going to drag it right over here to the side. And it's going to change it. And it added kind of gold on the sides, which makes it super cool. We can even we can have a glass fronts. Let's go back through the thumb, the arrow, we have a we have all of this is glass right now. So what if we on the back had some kind of brass so you can see the back through the glass. So it'll be glass on the front and bras on the back. So really interesting things you can do. We can even do ice. Let's do ice on this too. And let's change the bevel So I might hear on texts. So this one is going to be the second to go ahead and label our layers so we kind of know what's going on. Click on the arrow. We have our four different sides here. So let's do you'd do would do would on the bevels. So see how an added wood right there in the pebbles and makes it a really interesting kind of look for senior can always change that if you don't like it. Maybe do something kind of shiny. I think they have got put Copper and just kind of like a dark copper look. Bring that over to the pebbles. And that's gonna put copper in the bubbles now. And of course it gets really complicated. Once again, I could spend hours in Adobe dimensions, but each one of these has different roughness. So if I increase the roughness, that's gonna make it more dull. If I decrease it, it's going to make it more reflective of the light around in the environment. And go back out. And if you click on the main layer, instead of going into kind of the extra options and you just have this selected and you go down here and that's how you kind of edit what we did before. But we're gonna go in here. And instead of copper from maybe a silver. So you can edit the individual If you just drag it right onto the character, it's going to just do the entire character that one material. So lets, you can even change colors. So let's do, let's go up and do glossy. It's kind of like a plastic look. So I'm going to bring glossy on number one, the second one. So that's gonna make it kind of shining glossy. And you can change the color very easily by selecting. And right here, I just have this text for I'm not going into the extra options. I'm just have here right here text for. I'm going to go down to this little area right here. This is called the select material. I'm gonna go ahead and click it. Some allow you to change the color of the materials and some do not. This one, the glossy allows you to change the color, so I'm just going to click on Color. Let's say I wanna do like a bright yellow. I can do a bright yellow. And there is a cool bright yellow book which looks really good on the black. And once again, I can go in and add them material to this. So if I wanted to add a material to the side, I can bring in this dark material to the side. So think of all the different combinations you have that you can create stuff with. So let's do, let's do the owes. Something different from what we can do. This clean Gold look course, you already kinda have a gold on the zeros. So we want to have, you know, don't want to have all that blend in. But what I love about Adobe dimensions and is this just a pre-render? So it's gonna look a lot better when we do the full render because it's little blurry. See how it's kinda looks blurry. It renders out much more smoothly when you have, give your computer 20 minutes to render it. But I love how see how the gold reflects in the two. And it bounces off the owed though right here. I just like how all these interact. And that's when you can change the position of these kind of see how things interact. What I like is you can actually have it cover up. They see other fuse together right there. You can leave it that way. And it even looks like they are fused together. It kinda gives it a really interesting look. So we can change the position of these. Let's bring that back and see. And that one, that z-axis, little bit hard to see, but you can have this kind of go halfway in. And same thing with this. And you can even see kind of through because that one has kind of a glass look to it. But, you know, you can get really complicated with this if you wanted to. And what's changed the material to two. Let's do a different color with this. Let's do the glossy. And number two, and let's change the color. So I'm gonna go back and change it to like a pink or blue, or blue. There we go. So that'll come out and interesting in the pre-render. And you can change your camera angle at anytime it could change a background box there. To be enemy to your material, you'd like. So I just wanted to kind of demonstrate this quickly. You know, you can spend a couple hours really learning, spent a good day learning Adobe dimensions. So you can create some really interesting effects. It's really about playing around with the different materials, the lighting. We didn't even touch on lighting too much. It can change. The lens is just the default lighting, but you can go into the environment and you can change the environment lighting too, so you can make it more intense. You can do the rotation of a light, Coursera's different lights than just the default. One can bring in your own whites. So you have different angles of weather, the light, lighting sources coming from. So all that has a big effect on how the text looks as well. Especially when you have shiny materials, sometimes the lighting and the way it reflects really changes. So you can see how the, oh, it looks really cool there. We can take these three. And we can get the sampler tool, sample that gold. We can take the two, I'm just sampling, I'm just taking this little eyedropper tool, sampler tool. And I'm going to just make all these gold just for the fun of it. Getting a sampler tool, making it the same material. And just like that, we have this cool kind of goal book. If you don't want it to be super shiny and you want to have a more matte finish. And, and we talked about design trends. How more of a matte finish looks really good? Let's say, let's go ahead and select this to go into our options. And he had this properties down here and you can increase the roughness. So when you increase the roughness, you're taking away that metallic shiny look and you're making it more Matt. So increase the roughness. Of course there's patina is if you know about how metallic, yeah, add like a patina, See how it automatically kinda dolls and a little bit. So if you're running kind of a more dull shine and you don't have so much reflection which can kind of make everything look over process. Sometimes you can do that too. I wanted to show you how to render. So let's say I have this ready to go. I went to render it. I have this pre-render on. I can go ahead and select that off. You can kind of see what it looks like. And then here's the pre-render. Let's do a final render, and this takes some time. So we can go click over here to render. So right now I'm in design mode and you can click over to render. And you can render this high, which is the, the best resolution and setting our quality, I guess you can say because it's all going to be the same resolution. If you want a really high-quality, it's gonna take a long time to render. This would probably take about 45 minutes. I usually like doing medium because I'm pretty happy with medium quality. It depends on what your rendering is for. If you're going to do a big poster that you're gonna print, you probably want to take the time to do high. But in this case I'm going to do medium. I like to have a PNG of it and I love to have a Photoshop file because you can go in to Photoshop and do some edits on it. So let's go ahead and render. And we're going to render this. And we can always bring it into Photoshop because I love Adobe dimensions, but sometimes I really want to bring out highlights and shadows and a little bit more saturation and intensity. So I like to bring it into Photoshop and just add that using Dodge and Burn and some other kind of tools to help like really bring out colors a little bit better and to sharpen it. So it almost always needs to be edited in Photoshop to have a polished look. So we're going to do that really quickly with this. And then I'll, last thing I'll do is I'll show you how I kind of put together the topography poster.
14. Project #3 - 3D Typography - Part 3: So here's our Photoshop file that was just rendered took about ten minutes, so wasn't too bad because I did a medium render. So I'm here in Adobe Photoshop and we can, of course go in and add lots of changes and edits to this. We can sharpen it. We can really bring out effects. So I have, you have a couple of these additional layers that are added that you can toggle on and off this kind of more advanced kind of issues. So just go ahead and toggle that off. Don't worry about these additional layers. We're just going to worry about the, the main layer here. First thing we need to do is right-click create two smart object. So we can keep the original photo source and play. Go to image adjustments. We can do vibrance exposure, all these different things I like to go to shadows and highlights. It can really bring out shadows and highlights this way can bring out the background more. If you wanted to brighten it up and go hue and saturation so we can tweak the hue a little bit. We can even make it more copper if we wanted to increase the saturation I like to sharpen so I can go up to sharpen. Sharpen more kinda helps to really bring out details. And just to show you the difference, post rendering, editing makes and Photoshopped. This was my before of my 2021 design trends cover photo. And after about five minutes of tweaking, doing some Dodge and Burn to some of the letters, bringing out some of their shadows and also bringing out some of the highlights. I was able to kind of tweak it a little bit, even tweak the colors to kinda get a nice more polished, finished look in Photoshop posts render. Same thing for my typography poster, this kinda before. And this is the after, kinda added a little bit more warmer tones to the goal to make it a little bit more copper and just kind of brought out some accents. So I just wanted to show you this. This wasn't supposed to necessarily teach you Adobe dimensions, but just kinda show you how easy it is to create 3D topography that's hyper-realistic. There's so much more to Adobe dimensions to learn lots about lighting, and that was just typography. You could do objects, combine objects together to create new shapes are so much great content on YouTube about Adobe dimensions as well. So I just want you to be aware of this as an option for you. You can integrate 3D topography and just about any of your designs, any of your branding. You can use it for almost anything. So anyway, hopefully that's a lot easier than you thought it would be. I think Adobe dimensions wanted it to be easy for everybody. So there you go. There's the next design trend in the books. Bonus. I wanted to go in more depth about how I created this poster. I showed you a little bit before about kind of how it was constructed, but it was constructed the same way we did the class project with just each individual type letter, just like we did 2021. And let me go ahead and rotate this out. You can kind of see how all this looks. And I changed the depth of each one to kind of see how the a and the oligo and go ahead and zoom in here for you. See how the a kind of goes into the RNA, kinda makes it fuse together. That's exactly the effect we did with the 2021 where we put kinda some texts together. And I changed the depth of some of these. And to change the depth, you can click on the character, just click on the text. So let's say this is g. I could probably label these, go down and you can change the depth. So I can decrease the depth. Or increase in when you increase the depth and all these and you bring them all together like this. You can kind of create this fused. Look at you have here. And it's got kind of doesn't the reflection, it's not, it's a little bit more dull. So if I go into the material that go into the details of any of these, you can see my materials options. I have a little bit of roughness, so it's not going to be the super-duper, shiny metal. It's a little rough, so it kinda has this kind of matte finish to it. And so if I take the preview, the render preview off, you can kind of see a little bit better how all this is constructed. So let's go ahead and zoom out. I have it in a box. So there's kind of my photo box, if you will. And when it comes to like, arranging type, you know, that's the part. Like I said before. It's very similar to arranging 2D type in terms of readability. And just like you would arrange, you could even arrange this in a way that you like in Adobe Illustrator first to kinda get an idea of layout like where do you want, how do you want them to be stacked? You know, it could be totally different. Look to how I have now. So topography. And once again, you're in a 3D space, so not everything has to follow the same plane. So you can have things turned a different sign. I mean, there's so many different arrangements. A lot of times I like to pre-plan in Adobe Illustrator and vector first. Good idea, But of course, 3D space, it's hard to do that. And Illustrator, we could just turn it. And all of a sudden it does like a different option in this type this type choice, coal wildfire. I had this on my computer a while ago. And the reason I didn't do this particular typeface for a project is because I don't believe it's on Adobe fonts anymore. Sometimes Adobe fonts removes typefaces and they don't have access to them anymore. I still have this one installed, but I didn't want to necessarily do it for a project if you guys could not access that typeface, I would hate to do that to you, do a project and you wouldn't have the same typeface I worked with. I just really liked how the are looked. How a couple of these letters kinda this interesting are you can find any, you can use any font here, any font that you can install, even the really decorative ones, you can still bring them in if it's a font, you can use it and Adobe dimensions. So you can do serif typefaces, scripts, and just some really neat stuff. And I wanted to show you one other one. I did just kind of show you how you can put together topography and objects as well. So this is one I did for color. So you can see how I brought in a cube and I brought in letters, and I played around with the blocks and the letters so that some of the letters or in, in overlapping the box, so it looks like they're fused together. This is a liquid element. It's gonna bring that out, this little liquid element. You can find all these in your starter assets. Let me see where they are. They're going to be in the models. Let's, there's different splash effects. So you can bring this in and you can rotate this just like the type and adding material to it and you can scale it and make it bigger and you can even bring in this. I have kind of like a plastic look, so it almost looks like paint. But you can even bring in glass to give the Glass make it look like water too. So you can a material can change it to. So I just wanted to show you how these are constructed. Courses could take an hour to show you how to, how a constructed all this. But this is kind of, you can see I put some materials down here. So then it gives it kind of like an environment to be in instead of just being floating on a white environment. But that's kind of how this was put together. Let me Dolly out. You can see the whole entire space. But I would say this took about 30 minutes or so to put together. And then of course, maybe ten minutes and Photoshop to kinda tweak the colors to bring out more shadows, highlights, and make it more dramatic. But that's pretty much it. That's the 3D space, that's Adobe dimensions. I just wanted to shows projects I worked on to show you how quick you can put these together. And I can't wait to see some of your stuff, your 3D topography. If you wanna take a stab at it, I'd love to see some student project work. I would love to share it on my Instagram at Lindsey marsh design. If you want to tag me, I'd love to share your 3D work that you've done in Adobe dimensions with typography.
Lindsay Marsh, Over 500,000 Design Students & Counting!
