UX Design Portfolios with Notion (including Template)

1. Intro: Hello, and welcome to this course in which I'm going to show you how to create nice-looking and responsive, fully functional portfolio websites with Notion. My name is Max, and I've created many portfolios for myself in far more than 10 years now. I'm currently working full time as a senior UX designer and researcher, but I still use Notion a lot for almost everything imaginable. For me, the biggest strength of Notion is that it enables its users to structure their content and data in a very, very short period of time, one that leaves enough flexibility to display the data in an understandable way. But it comes with limitations and you will need to live with these limitations in order to fully make use of Notion. In fact, what Notion did is called limitation by design. This simply means that you cannot do whatever you want in terms of layouting and styling, so that your time can flow into the most important tasks which are, according to Notion's beliefs, structuring your content. But this is exactly addressing a problem of many people in design who need or want a portfolio, but don't necessarily see the justification for spending hours and hours on creating set portfolio. We can make use of the pace of working with Notion and create a very accessible, clean, and even good-looking portfolio without spending too much time on it and without having to code a single line. With Notion's publishing feature, we can even host it publicly in a matter of seconds. I'm using Notion for many different tasks, both privately and professionally. I'm planning vacations and my hobbies, I'm scheduling and planning my videos, I'm keeping track of tasks at work, and I occasionally write a journal all on Notion and I really like it. Tune in for this course, get your work samples ready, and let's jump into the first chapter of this course. Enjoy. 2. UX Snacks: Let's start this course by becoming familiar with the topic of UX Design Portfolios with Notion. I want to show you a bit of information about that by going through something that I call UX snack. It's a bite-sized social media post that I create to wrap my head around the matter, and I think it can be compared with a literal snack as it can be consumed so quickly. Let's switch over to my Instagram channel. UX Design Portfolios with Notion. Three steps to unleash the power of Notion and create your own UX design portfolio. I obviously wanted to keep the engagement high, provide some info, and have my readers to keep on swiping through this post, so no big learnings here yet. Now first, set up the structure. There we go. This is just a little bit of expectation management. Of course Notion won't create a page for you. You still have to think about the structure and how you want to present yourself. We're not talking about information architecture, but very much about content strategy. What do you want to share and what don't you want to share? Second, add project content. Again, it's you who has to provide the content. Think about what you want to show here. If your content is bad, Notion will not be able to hide that. In fact, I think the opposite is true. Your work samples should be up to date and in case of you being on job hunt, match with the requirements of the job that you want to be hired for. Third, stylize with super.so. Super is a great tool to upgrade your Notion portfolio. You absolutely don't have to use it. But if you do, you get to customize a lot of stuff and your portfolio will be almost unrecognizably coming from Notion. It's absolutely mesmerizing and I will show you how that works and what you can achieve in this course. The bonus; use Fruition instead. Fruition is a free alternative to super, but it involves a certain degree of knowledge when it comes to handling code and working with Cloudflare, so it might not be for everyone. Done with the snack. Now that we all have a basic idea of what's to come, you can all confidently continue with the next chapter in which we will set up the structure of your Notion portfolio. 3. Set up the Structure: Cool. Let's talk about the structure. In fact, I don't want to talk a lot before actually starting the work. Let's move over to Notion, and together let's set up our portfolio by creating the rough structure and setting up the content that we want to provide. The first thing here you have to do is create a new page obviously. We don't have to do any modifications to the layout as of yet. I mean, of course it's a matter of taste, but I didn't do anything, so we're still in the smaller width. We do not have to apply the full-width toggle. When it comes to the three typefaces that Notion is offering, which are Default, Serif and Mono, I start with the default font and we're good to go actually. For the title, I am typing in my name. Which will also then appear at the top of this page. It will be there as some sort of logo as well, but that's the very first thing that we can do here. The next thing that we can do, is adding an icon. We just have to click here on "Add icon" and what Notion does it will pick a random emoji here. You can of course just leave it as it is, you can pick another emoji, and you can also upload an image. I would suggest using an image in square format. Recommended size is 280 times 280 pixels. It can of course be larger. I prepared an image that is I think 512 pixels in size and I would just upload a profile picture of myself within a circle, so it works nicely as a picture of myself as an introduction every element but also becomes part of the logo up here. The next thing that we can do is write a welcome message. We do that by adding a Callout element or block. In this case, I would just leave this wave emoji here because it has a nice message of welcoming someone and then we can go ahead and write something like, "Hello, thanks for taking a look at my portfolio. You can find even more information about me on my website. Also, why don't we connect on LinkedIn?" I think that's a nice way of welcoming someone. Suggesting other ways to go, other ways to connect. We always want to keep them at our self so we don't want to link to a completely different website. In this case, I would add the link, of course, to my LinkedIn portfolio but as I can't remember it, I just will, for the sake of this course, add the link to linkedin.com so that you see how to add links, if you don't already know that. I also like to make the links bold so that they stand out a little bit more. Then on my website again, I will add the link here. It's maxbrinkmann.com, and "Bold" That's it for the welcome message. That's already the first thing. I want to invite people to stay on the platforms that I created and want to have them as close to myself as possible. I don't want them to leave directly, so I want to provide the most interesting content that's possible, of course. Now the first section usually would be the education. At first you want to talk about where you come from and after the education part you will talk about your work experience and then you can talk about the projects that you created. This is at least the approach that I'm following and it's sort of a chronological approach following time if you want. So the first thing that we want to add here is a heading two because it's not as big as the heading one. But this is really just a matter of taste, and I'm calling it education. Then, I'm adding a bullet. I do that because I'm now entering the first step or the first milestone of my education that I want to mention and it's my bachelor's degree, so I will start by writing the time in which I participated at this course. It was 2008 until 2011 and then we'll "Shift" "Enter". I'm creating a line break and then I'm entering the name of the course. Which was BA, then Interactive Media Design. We can also add a link here. You obviously would research the actual URL. I will just add random URL here, but you get the idea hopefully. Then the third information that's usually provided here is the university at which you took this degree. In my case, it's a German university called Hochschule Darmstadt. My second milestone would then be my masters, which I did from 2013 to 2015. The name was M. A. Leadership in the Creative Industries. Again, I don't know the URL, so I will just add a random URL, and the university was the same. It's still bold and that's a typo. We'll remove the bold formatting. Now I really would prefer these two bullets to be side by side and not underneath each other because we're giving away so much white space here at this side. By the way, these green round arrows come from a browser plugin called Grammarly, so it will just check my spelling. If you don't have installed Grammarly, you obviously won't have these green elements here, but they will not be visible in the final product, in the final portfolio. By clicking here, we can drag around all the different blocks and we can just drag it to the right side. You can see the blue line indicates that it will be added on the right side of this block here, so that's exactly where we want to have it, because it will automatically create this two column grid, and this is exactly what we want. The good thing in terms of responsiveness is that it will stay like this and the breaking points are predefined by the columns, so depending on the width of the device on the screen, it will all naturally flow and it has a quite nice behavior. I personally did not see anything that really annoyed me when it comes to responsiveness and at the end of the day, it's only a tool to make your content accessible. This is already the educational part. The second thing would then be the work experience. So we're creating another section and we're introducing this section by adding another heading too, and we're calling it Work Experience, and then we are following the same pattern as above, where we want to add these bullets and we want to list all the major milestones in our career. Maybe you want to mention everything, maybe you don't. In my case, I'm really just looking for major employments of mind soul, all the full-time jobs that I took. I'm leaving out all the working student jobs and all the internships. In this case, that would be three milestones that I can refer to. Again, I'm creating a bulleted list element. Again, I'm starting with the timeline or the timeframe of this milestone here. This was 2011 until 2013, and this was my first full-time employment as a junior UX architect. I was employed at OgilvyOne, which is an international agency. I did a lot of Facebook apps back then and automotive stuff. I think it's at ogilvy.com. I'm making a vault again. I'm just highlighting this block, copying and pasting it so that I can just simply change all the content, all the information, which is a little bit quicker. The next step would be 2015 to 2017. Here, I was a regular UX architect at another agency called MRM. McCann. I think it's mrm.te. Again, we can drag and drop and have this two column grid. Now, I'm pasting it again. The last, and the current, and the most up-to-date step is 2017 until now, where I'm a Senior UX designer at Merck in Germany. That's my work experience in a nutshell and as you saw, I just dropped it right besides the second column and it became a three-column grid, which is really nice and really handy. Now, the last thing when it comes to the basic structure is something that you can do if you want. It's just providing I would say a little bit more visual relaxation because we provided a lot of text now and it's nice to the eye to have some images now before we actually start with your work samples and we can show some of the clients' logos that we have worked for. This is just providing some context on yourself. You can obviously exchange that with someone, something else, whatever you like. Something that I see quite often are these charts saying how good your knowledge is in a certain topic or with a certain software. Really, I don't like these charts. I would really encourage you to not use these charts because for me at least, they don't make sense. Maybe for you, they do. Then maybe you can explain them to me because I don't understand what does it mean when it's fully I'm filled. What does this a 100 percent mean? Does it mean you invented the tool and you know every feature? It just doesn't make any sense to me, but definitely, showing some of the clients is a nice idea, at least I think so. Because we are talking about the work experience, we can use something like "For clients such as", we said, the work experience was done there and there and worked or you worked "For clients such as", maybe let's add this extra space here in order to have these more even, the margins between the sections "For clients such as", and then let's add an image. Again, I created something here, which is a list of logos. It's just a PNG with some grayscale logos on it. There it is. These are just a few of the clients that I worked for most of the time obviously, it doesn't make much sense to mention clients that were only a small portion of your work because you always have to be prepared to get questioned about these clients once you're in an interview, for example. I would say that's a nice and solid foundation for the portfolio. Of course, the most important thing is missing, it's your work samples and because it's so important, I want to dedicate it with separate and own chapter. Let's move on to the next chapter and talk about how to add the work samples. 4. Add Work Samples: Cool. We now created the structure for your portfolio. Now, the most important thing is still missing, it's a work sample. Let's move over to Notion and add these. I hope I can provide you with a smart way on how to do so and make full use of what Notion offers. What we're going to do is add a gallery. A gallery is working in a way that it adds multiple tiles, and these tiles are referring to individual pages. You're creating sub-pages for each of the projects, but you can also add a lot of useful information to these pages, and it's already integrated into Notion. It makes a lot of sense to make use of this rather than trying to recreate these pages in a manual way because, again, we want to save time. Let's go ahead and add a gallery to our Notion page. When we write gallery here, then we can select between an inline gallery and a full page gallery. Since we're in this one-pager layout, we should stick to that and pick the inline gallery module which will have us end up with this basic grid. You can see there are these blank pages which will become your work samples. We only have to provide this module with a title. Instead of picking this headline as we did before, we're now entering the title here directly. This is a bit of a downside to be honest because it's a different styling. These headlines will be slightly larger than this one here. Again, the headline three will be slightly smaller. There's not really a way to recreate this size, but if you just leave it empty, this untitled title will remain even in the public view. That's quite a bummer, but what can you do? We will at the first work sample here. We do that by just clicking here on this one and just treat it like a regular page. We will give it the name of the project, of course. The first one that I am mentioning here is the UX toolkit. Here we can see the area of tags and meta information that we can provide here. This is just a nice way to provide an intro into your project by providing some information that might be interesting. The first thing here, it says Created, and it's the timestamp of when this page was created. But we can change that to when we click on that, and then go on property type. We can pick a date. This will leave us with an empty field. We can now select the time or the date at which this project has been created, which makes much more sense. In this case, it was the 17th of February. This was the day when we launched this tool. Now we can add tags, which is also very interesting. But we can also change the name of this category here. Instead of tags, we can give it a name that's a little bit more meaningful, for example, role so we can define or list up all the roles that we had to fulfill while participating at this project. In this case, it was user research for me, so I'm just writing User Research, and by hitting Enter, it will create a tag with a certain color, and it will keep this color throughout all the projects. I'm just hitting Enter. But this was not all. I also did the copy and I did UI design. It's true. Now, the third thing that might be useful here is the URL, so we're adding another property and we're selecting the property type URL. We click on that again and change the category name to URL, hitting Enter. Now we can enter something here. By selecting the type URL, it will just convert whatever we enter into a actual clickable, interactive URL. In this case, the URL is uxtoolkit.merck.design. That's already it for the meter section, I would say. Here's just some demo content which we don't need. We're going to add the actual project-related content here of course. We can just go ahead by starting to write something basic, a very short introduction because maybe the people who are taking a look at the portfolio don't want to read through the massive amount of text right from the start. They just want to understand what the project is about. If they like it or if they find it interesting, then they will probably dig deeper. Start with a short introduction here. A collection of methods for kick-starting your next digital product driven by UX design and freely accessible for everyone. Cool. This is for the introduction, and then it makes sense to continue with what we already got to know before, it's called a callout. It's a nice way of highlighting something. Here you could now talk about what exactly it was about, what you did, and provide some more information. You can again pick an emoji here or upload an own image. I would maybe use this triangular ruler just to make it look more technical, but I'm not going to write a lot now. I just will copy and paste this just to give you an impression of how that might look like. Then the interesting part begins. We're adding the media. Let me just quickly close this. Because as you can see here, we're currently only showing the text information in this box here, which is not what we want. We want to show visual stuff, like images and all that stuff. What we need to do is add images. Notion will always pick the first image that you place here in this Project page as a thumbnail for the card on the gallery module. We have to add an image. We will upload an image from our prepared selection of images. In this case, I'm talking about the toolkits. This would be the thumbnail image, so I'm hitting "Upload". There it is. I will just wait until it's being uploaded, resize it just a little bit, and there it is. Now, in Notion, you can provide captions to all the media elements. I will just write something like cover image just to provide some context. Then we will continue by adding even more images, which are then the more content-related images, and which are maybe interesting for the people who are taking a look at the portfolio. I think I've prepared just another one for the UX toolkit. There it is. I will just place it here and provide a caption as well. UX toolkit overview and UX toolkit Detail page. As a user, you can, of course, then interact with these images and you can click on them, and this will enlarge the images. That's the way that can work with images. We can also add other media and, I will show you how that works with the next project. But for this, I think we're good. I will close it. As you can see here, it now shows the first image that we added in the content. One thing that's a bit annoying for me is this bar on the bottom here because I prepared these thumbnails in a way that they already include the project name, so I don't need to mention it here again. I can simply click on these three dots up here and select "Properties" and then hit the toggle at the name because I don't want to show it here. This will simply hide it. Of course, now you can see here the different categories that we specified in this first project. If we switch the toggle on, we can show all of these information pieces. If you want to do that, if you maybe want to show the URL, if you maybe want to show the roles, you can totally do that. I just like to stay clean with only showing the thumbnail here in this overview. The next project I'm going to add is called Scolary. As you can see, all the different categories are still here. We're up picking another date, in this case, it was the first of September 2017, I think, hitting Enter. This is also a way of how to add dates. Then roles, again, user research, copy, UI design. URL is Scolary.com. It's not scholarly, it's Scolary. Then it's pretty much the same, as before. Do I still have it in my clipboard? Yes. We're starting with a short introduction, then we're creating a call out, then we're pasting. In this case, the same content so that we have a little bit more. Then, again, I'm adding the thumbnail as the first image, and it's called Scolary. I'll just resize it a little bit. This works while uploading, which is quite nice. Once it has uploaded, I'm adding a caption, and it's again cover image. Then, I'm adding another image, which is, in this case, a screenshot of the overview page. I'm adding another image, which is in this case, the screenshot of the detail page. I will just, put it to the side. Now, I'm adding a different piece of information here. The first thing again, will be an image, but, it will be an image or a screenshot of something that I call insights map. I talked about that in the user interview course, so you might be familiar with that. I will just place it here, and I will provide a PDF to that as well so that interested people can check that out. At first, we will provide captions, overview, and here as well, Scolary detail page. Here as well, let's just call it insights map. Now, we want to add a file. Choose the file and PDF note will upload, and make that accessible as well. That's the thing that I was referring to. You have all the content already there, you can just put it all there, just throw it in Notion, and it will work. It will be accessible. That's the most important thing at the end of the day. Now the third project that I want to include here is the Liquid design system. This one has been created, I'm not sure. I would just pick a random date here. It was a few years back. In this case, I did this, this, and this, and a little bit of front end development and just a bit of CSS stuff. URL is ids.merck.design. We're adding content, we're adding an introduction, we're adding a call out. Now, we're adding an image. We will just resize that a little bit, provide it with a caption, which is cover image. Here, I have a trailer and I want to provide my portfolio users with that trailer. I'm uploading a video by adding a video, of course. It will start uploading, this will take a while. There it is. Finished uploading. I'll just make it a little bit smaller. Then again, I can provide a caption here. It worked. Yeah. Now it's directly in the tool which is quite nice. Now, something also very nice, that we can do with Notion is if we have a Figma link, we can add it here as well. It has native integration for Figma. We can just type Figma, hit "Enter" Now it needs the public link. I will just quickly look it up. Now I can paste it here, it's just a normal Figma link embed. We will wait a few seconds, and there it is. This is really cool. Again, make use of Notion and of its native features so that you can be as quickly as possible. Just let's call that Liquid assets in Figma. It's interactive, that's the entire thing. You can pretty much use it as any other public Figma file. Cool. Let's move ahead. The last project that I wanted to include here, which also shows just one other media type, is a website for Opel, or Vauxhall if your in UK. What's the website, I redesign. I'm just going to add some random dates here and some random stuff. This of course is for the Germans. This is a German car brand, it's opel.de. Again, let's write something here, it really doesn't matter. You get the idea. I mean, it's just about providing an introduction about the project. Then again, the call out. Larger, more detailed intro. Then, we're adding, a thumbnail image for our Opel. Once it has finished uploading we can provide it with a caption. We're calling it cover image. Now we can even include external videos. We can include much more obviously. Even for developers, it makes a lot of sense because you can integrate code, you have syntax highlighting, all that stuff. But for your X-Designer, maybe that's sufficient. Let's again, use the video because we can upload, but we can also embed links from YouTube, Vimeo and more as they say. We will just need to copy the link, paste the link, embed the video, wait a few seconds, and there it is. It's the trailer. Provide it with a caption, launch trailer. Then, I just have one more image that I want to add here. It's an image from the screenshot from the car configurator. I will just add this caption here as well, and that's it. That's pretty much it. As we can see, as you all can see, we now have four work samples here. They all look very nicely arranged and very accessible. It provides all the information that we had, that we wanted to add, and it was a matter of minutes. You really can't beat the quickness of Notion. Of course, you can spend more time in the actual lay outing. You can rearrange the different modules, you can do it as you personally like, but I think this is a nice way of starting off. Just giving you the idea of how to do these things, and how to set up your work samples in Notion. In the next chapter, we're taking a look at upgrading this. Now we finished the website, the portfolio, and with Super, we can just move it a bit further. It's quite interesting to see that. I definitely want to show you. Let's move on to the next chapter. 5. Custom Fonts and Colors: Let's take a look at Super and how you can upgrade your Notion portfolio. Super is a tool that jumps in in-between the user and your Notion website. By that, it's able to inject a certain degree of extra code which enables you to modify and customize your appearance. I would just like to start off by showing you some of the portfolios that have been created by using Notion and Super, and they're really nice. They have the Showcase section on their website, super.so. As you can see here in the thumbnail, it's already quite. The mind-blowing thing is, this website also has been created using Notion and Super. So you already get an idea of what you can do. Of course, the fancy stuff is done by custom CSS and injecting code. For these kinds of things, they don't come out of the box. You have to know a little bit of coding, but still you can keep all your data in your Notion. That's the advantage. You don't have to run a separate website. You can expand the potential of Notion a bit. Just take a look here at this portfolio of her. You wouldn't say or you wouldn't see or recognize that this is coming from Notion. This is really a nice example of what you can do, of how you can change the overall experience and all the flexibility that you have. You can change the buttons. There's really a lot of stuff that you can do. What else is there? When you're starting out with Super, you get to access all these guides as well. They are tutorials on the more simple task to get you going. As I just said, the stylized buttons, for example. They have really nicely and detailed instructions here with videos for each of the different steps. Then you can see there's this extra code that you have to add, but at the end, you will come from this and end up with this. That's the basic idea. But of course, there's also easy customizations to be done and I will show you how that works just in a few seconds. They provide you with icons as well. You can just click on them, and they will be copied, and then you can paste them into Notion. That's also nice and handy. When it's coming to the pricing, then it's not for free. As you can see, it's $12 per site per month. Per site means one page and I think unlimited sub-pages. If you want another page with a separate URL, that would require another account, I guess, or another $12 per month. I would say let's sign in or just jump into the Super back-end. This is how it looks like once you created your account. Here, you have all the different sites. In our case, it's still empty because I would create it together with you. Then there's the Billing section, there's my account, and you get support, all that stuff. You have a community. It's really nice. Let's go to Sites and create a new site. Now, you have to pick between two methods, as they call it. The one is Super Static, the other one is Super Default. Super Static is hosted on a Super server. It's actually a really clever way of calling your products Super. They have a Super server, and it's hosted on the Super server, which makes it faster because this one, this Super Default, is still hosted on Notion. Still, they need to do their customization, and this will slow that down quite remarkably. Still, this is the option which is most compatible with all of the features because it's still coming off from Notion. So for example, calendars and timelines will not work with Super Static but will work with Super Default and it has the default search engine optimization. With Super Static, you have optimized SEO, faster page speed, and it stays in-sync with Notion but it's not compatible with calendars and timeline. So if you're using these two modules, then you should stick to Super Default. If not, I would recommend to pick the Super Static option here. Let's go ahead, provide that with a name. I will just pick my name. Here we have to pick the custom domain. You have to do that, you have to have a domain. It can be also sub-domain. In my case, it's portfolio.maxbrinckmann.com. Then we need the public Notion URL. I will just and drag our status, our portfolio here so you can see how that looks like. You need to share and share it to web publicly. Then we can just deactivate this, allow duplicate as template. We don't need any of this. We just need this link of this public space. Then we can add this here because it needs to be linked to the URL. Let's click on "Continue". Now, we're talking about pretty URLs. When we have sub-pages, we can map them to pretty URLs. I will again bring the portfolio up because I want to show you how that works with this example with the UX toolkit. We click on that. Again, if we click on "Share", it is already shared because the parent page has been shared. We just need to copy the link. Let's minimize that. Add this here, and we want a nicer pretty URL, and we just call it UX toolkit. Instead of this, we will have portfolio.maxbrinckmann.com/uxtoolkit. You can add as many more as we want. Let's continue. You need to add your domain to your Notion page. This is handled by Super. You just need to switch or select your domain provider. In my case, it's one and one, so it's not listed here. I just need to click on other, and there's the instructions. We need to add a CNAME record to our domain, my domain, with the name "portfolio" and the value of cname.super.so. You need to look up how that works for your domain provider. But it's really simple usually, and it's quickly done. Once that's done, we can click on "Continue". Now it gets interesting because we can start customizing the visual experience. The first thing that we can do is pick a custom font. There are a lot of fonts. I'm not sure where they're coming from, if they're Google fonts or whatever they are. But they provide you with the option to select one of these and they will change throughout the entire website. So here, you cannot say only the headlines should switch in their fonts or typeface, but it will be a global change. Of course you can do that even down to single modules with custom code. But just in our case, let's switch to the IBM Plex Mono typeface. Then we have a site image shown when your site is shared. This is just the OG image meta tag, if you're familiar with that. I think I've prepared that as well. OG image uploading. Then we can create a custom fav icon which appears then close to the URL. We can do that as well. It should be a square PNG. I think it is. Then here, site description again, this is only for the OG tags "Description, hello world." I think I will show you how that looks also as well. Then here, you can inject the code. You can add code snippets here. You can add anything you want. You can add code for analytics or custom CSS or whatever you want. But I'm not doing that. You can enable or disable the site search. You can show or hide the page properties and you can enable or disable the search engine indexing. These are also quite handy settings that you can do here, customizations that are quite nice. I think that these pre settings here are really working out well for me. So I'm clicking on "Continue". It says "Done. Your site should be live shortly. If you run into anything, just give us a shout through live chat or by email." Done. Now, it says checking for DNS. Once that's done, we can continue. We have to wait a few seconds now. Progress. Now it says Live, and we can click on the link and it will guide us to our new portfolio. As you can see, it looks a little bit different than before. Let's check out how the public shared link looks like if we don't apply all the Super changes. We still have the search here, we have Notion there, and we have obviously the different fonts. This is how it looks like with a different typeface applied. You can see the difference, I think. That's the new URL. Now if I click on Toolkit, you can see that it matched the new Pretty URL as well. If I click here, for example, where it didn't apply that, it changes to this hash at the end. So it's definitely worth exchanging the URL just to have it in a more proper way. It's looking more like a website, it's feels also more like a website. So it's definitely worth trying out and if you want to spend the money, then totally go for it. I think they made a nice product and it's a nice hacky way. It's matching the spirit of using Notion for websites anyway, so I like that. Now, the last thing that I wanted to show you is how it looks like in a shared post. I will just copy the URL. Move over to Facebook in this case because they can really quickly render these previews. When I paste it here, we should be able to see the OG image and description that we enter just a few minutes ago. There you see, this is the image that I enter. Here, as you can see, it says "Description, hello world". Whatever you want to enter, it will be integrated in this code use. That's how you can spice up your Notion pages with Super. This really helps to bring in a tiny bit of individualization with really little effort and makes our portfolio standard out. As you saw in the showcase section, there are literally no limits to your creativity. If you want to modify your pages, you have more or add custom CSS. I think at some point, the whole customization invalidates the whole point of using Notion over an entirely custom website, but that's a matter of taste. If you're up to do that, you should totally go for it. This wraps up the learning content that I wanted to share with you. I would like to ask you all to continue to the next chapter before closing this course. Thank you very much. 6. Feedback: We're not completely finished with this course yet, but thank you for joining in and making it this far. At this point, I would like to ask you to tell me your thoughts about this course. Did it meet your expectations? What would you like to see in my next course? Is there a topic you'd like to get more information about? I'm highly dependent on your feedback, so please tell me what you think so that I can continue to create the best course as possible for you. Thank you. Now let's wrap up this course and take a look at the class project. 7. Your Class Project: Congratulations for completing this course. The only thing left to talk about is the class project. I would like to encourage you to try out what you learned now on your own. Get yourself a Notion account, it's free, and create your own portfolio with the Notion. Share your links with me if you like and I will provide feedback for you. As with most things this is a lot of trial and error. Of course, you want to make your very own portfolio and not an exact copy of what you just saw in this course. So you will have to mess around with the tool, with your structure, and with the content. Eventually, you will get to a point at which you can confidently handle these things and come up with a result that is satisfying to you. I hope you enjoyed this course and I hope to see you in another one one mine again. Take care and goodbye.