built your portfolio with Notion @ tips & tricks

I wrote a blog on using Notion for portfolio yesterday, but now I’m taking the challenge to ‘im-write’ ((improve the writing) in a different way.

Hello everyone! Last week, I finally completed my graduation portfolio, so I’d like to share some experiences in building a Portfolio with a familiar-yet-unusual software: Notion.

Please, if you have time, check out and give feedback on my portfolio here: www.bit.ly/hjtr-portfolio.

Notion is a widely popular note-taking app globally. Apart from familiar Portfolio creation tools like Wix, Google Sites, Canva Website, WordPress, Squarespace, Adobe Portfolio, etc., I find Notion a good option for several reasons:

• Super-fast and convenient content editing.
• Outstanding ability to embed and display various multimedia with simple copy-paste actions.
• Free for .edu accounts. Even without one, the features in the free package are more than enough for personal use.
• Automatic adjustment on phones/websites inteface: Some platforms like Wix require manual adjustment for both interfaces.

5 TIPS FOR USING NOTION TO BUILD A PORTFOLIO

⭐️ 1. Use the Home Page to ‘sell yourself.’

In the Home Page, I divided my Portfolio into 3 parts: (1) A brief introduction about myself, (2) Introduction to the Design Principles I apply or prominent experiences, (3) A glance of major projects I have been involved in designing.

Besides these sections, I also added just the right amount of ‘spices’ – a small survey at the bottom of the page and some personal projects.

⭐️ 2. Use Subpages/Databases for major projects

I summarized my major projects into 5 sections, e.g., (1) Project Overview, (2) Target Learners, (3) Design Solution, (4) Lessons learnt or Feedback, (5) Reference Materials.

For these pages, I used the data labeling (Tagging Data) feature to highlight the technologies or skills I used in the projects. (See more in the ‘My featured work’ section in my Portfolio)

Warning: Using Database pages limits some functionalities, e.g., column layout – so it’s best used for simpler content. 😉

⭐️ 3. Use Toggle features for detailed information.

Toggle is a feature used to hide/show content upon selection. As for my university, I was required to list all Competencies demonstrated during the design process, and this list is… super long – so I put all these detailed items in Toggles to ensure ‘details if needed, overview if preferred’.

⭐️ 4. Minimalist decoration that suits both white and black backgrounds.

Since the Notion web background only has two colors: white (default) and black (when the computer is in ‘Dark Mode’), the images used for web decoration also need to follow the ‘minimalist’ spirit.

The images I used in the portfolio were from two sources: Freepik & Dall-E. When creating images with Dall-E, specify keywords like ‘minimalist’, ‘line drawing’, ‘black/white background’ for the most suitable images. Additionally, you can also maximize the use of Notion’s lovely icon set for headings, e.g: ☀️

⭐️ 5. Search for ‘widgets’ for missing features.

Fundamentally, Notion is still a note-taking app and lacks many web page functionalities, such as Navigation Bar, photo collage, etc. To ‘handle’ this, I chose… to learn coding 🤣. The above features can all be coded with HTML. For me, this was also a great opportunity to learn and practice this common language in LMS platforms.

For example – I followed the guidance here and successfully created a Navigation Bar Widget.

Or, I quickly created a survey with StrawPoll at the end of the page because Notion only provides two types of data: Total View and Unique View.

In my professional experience, I realized that no platform/tool/technology is perfect and has all the necessary features. Therefore, finding flexible ways and overcoming barriers is extremely important, which I was humnlr to experience in this challenge.

I look forward to receiving more tips on how everyone has been using Notion in their learning experience designs. 💙🧡