Create an Online Portfolio:
Use Wix to Build a Portfolio's Basic Components
A guide to creating the Work and About sections of an online portfolio using Wix, a free,
user-friendly website builder.
by: Danielle Huliganga
To any professional looking to build a space that showcases their best work, whether it’s academic, business, creative, or personal—to you I say, welcome!
With this guide, I hope to help you create the basics—the “backbones”—of an online portfolio: the Work and About pages.
Why create such a thing? Online portfolios are the very definition of “show, don’t tell.”
In other words, this is your way of marketing yourself. Statistics show that it’s no longer enough to have a resume; an online portfolio, or some kind of online presence, will help you stand out against the crowd. And with Wix’s easy-to-use editor (along with supplemental help from my guide), creating an online portfolio has never been easier!
Contents
What is an Online Portfolio?
Quite simply, an online portfolio is a digital space that presents your best work. Contrary to popular belief, an online portfolio is not just for professionals in design-related fields. While it's advantageous for art, photography, videos, etc. to be showcased online, it can be just as valuable to digitally upload articles, blog posts, presentations, and more, as well.
Plus, a digital space gives you a chance to dabble in design. More importantly, online portfolios give you a chance to show off who you are in ways that a printed portfolio simply cannot.
Here's a tip!
Strive to have both a print and online portfolio. Despite our technologically increasing world, you might not always have access to the Internet. And in some cases, such as job interviews, it might be more appropriate to hand in a printed version of your portfolio. In other words, it doesn’t hurt to have both!
Examples of Wix Portfolios
Author's note:
I recognize that all these examples are from design-related professionals. But I promise you that all people, no matter their professions, can benefit from creating an online portfolio. In fact, stay tuned for a look into my own portfolio where I showcase projects made for my (non-design) English classes.
What is Wix?
Wix is an online platform that allows users to build, create, and edit websites with drag and drop tools. Wix is free for the public to use. However, if users wish to have access to more advanced features (i.e., connect to their own domain, remove Wix ads, etc.), they can subscribe to a premium plan.
For an in-depth break down of Wix and its services, check out this review!
I can personally attest to Wix’s usability. I’ve created websites using their ADI system and Website Editor. The ADI system will design a website for you based on your answers to preliminary questions. Users will then have the ability to edit the website created for them. Wix’s Website Editor gives you more creative freedom, allowing you to choose your starting template. For a challenge, you can even start with a blank template. While starting from scratch is not required for this guide, I hope that one day you will feel comfortable enough with Wix to take that leap.
Examples of ADI vs. Website Editor
This was the first edition of my portfolio, which I created using Wix’s ADI system:
The second edition (a work-in-progress) was built with the Website Editor:
Truthfully, both renditions are very me, but I can’t help but swell with a little more pride when I look at the second edition, especially knowing that it was built from scratch.
Regardless of your chosen template, I hope that you feel confident with your end product. And if my experience is anything to go by, there will be many chances for revamps and revisions. That is, the evolution of your portfolio will reflect the growth of your Wix experience and design abilities.
A Quick Word on Design
Some of you might be worried about designing or the aesthetic execution of your portfolio. Some of you might be worried that your portfolio won’t look good enough or that it won't look anything like the examples I’ve shown you.
Before we begin building your portfolio, this is the most important thing to keep in mind:
your portfolio is about you.
Regardless of your experience with designing, crafting your portfolio is about showcasing who you are. So, please, stop worrying if your portfolio looks good enough (which is such a relative term anyway). Do what looks and feels right to you. That’s all that matters.
Besides, Wix is here to help! If you’re not sure where to start, I recommend starting with one of Wix’s pre-made templates. Most of the design work has been done for you; now, it’s just a matter of uploading your work and plugging in the missing details.
Here's a tip!
Just because you’re creating a portfolio doesn’t mean you have to use a portfolio template. I do this all the time when using Wix. I look at other templates for inspiration and potential design aesthetics. And even if you don’t have any design experience, you can still see what other people are doing: how they are laying out their texts, organizing their images, structuring their sites, etc. In other words, explore what's out there!
The Work Page(s)
Now it’s time to let your work shine!
Before we begin designing, let’s stop and reflect on the following questions:
-
What are your best works?
-
What pieces illustrate your different strengths?
-
If you have an intended field or job in mind, what work is most appropriate to show?
Hopefully, these questions will help you notice a pattern to your work, a way to organize and group your pieces together. The following sets of instructions will show you how to add different kinds of projects to your portfolio. I will also show you how to arrange your work on single and multiple pages.
But First: The Text Box
When you introduce a new project to your portfolio, you’ll want to orient your audience. That is, present its context: what it is, why it was created, whether it was created individually or collaboratively, etc.
The simplest way to add this information is by using a text box: themed texts, titles, and paragraphs. I’m anticipating multiple uses of this feature, so we’ll start our instructions here.
On the left-hand side of the Editor, click on ADD :
-
Select TEXT
-
Drag and drop the desired text box to the page
-
Click EDIT TEXT
-
The TEXT SETTINGS menu opens
Instead of spelling out how to use the
TEXT SETTINGS menu, I invite you to watch this video from Wix’s YouTube channel, which combines illustrations with voiceovers to show you how to add, edit, customize, and link texts.
Part I and II of Text Settings Menu
Adding Your Work
Author's note:
Unless otherwise noted, for this section's instructions, you will always begin by going to the left-hand side of the Editor and clicking on ADD .
Add Images
-
Select IMAGE
-
Click on next to MY IMAGE UPLOADS
-
The CHOOSE IMAGES menu opens
-
Click on the orange UPLOAD IMAGES button
-
Choose an image from your device
-
Once the image uploads, select it (you’ve selected the image when a blue check mark in a white circle appears)
-
Click on the grey ADD TO PAGE button
Choose Images Menu
This process can also be used for uploading videos to your portfolio: select VIDEO instead of IMAGE, and follow the instructions above.
Upload Documents
-
Select MORE
-
Scroll down to DOCUMENT BUTTONS
-
Drag and drop the desired file to the page
A button is a clickable icon. In other words, when users click on a button, it prompts an action (i.e., downloading a document, opening a new window, travelling to another section of your portfolio, etc.).
A quick definition:
-
The CHOOSE DOCS menu opens
-
Similar to uploading an image, click on the orange UPLOAD DOCS button
-
Choose a file from your device
-
Once the file uploads, select it
-
Click on the grey ADD TO PAGE button
Selection of Document Buttons | Choose Docs Menu
Link to External Projects
-
Select BUTTON
-
Choose either a text or icon button
-
Drag and drop the desired button to the page
-
Click on LINK
-
The WHAT DO YOU WANT TO LINK TO? menu opens
Here's a tip!
For a portfolio, the most helpful options will likely be:
-
page (another page of your portfolio)
-
web address (external projects on other websites)
-
document (select a file from your device)
What do you want to link to? Menu
Organizing Your Work
One way to organize your work is by allocating separate pages for specific types of projects.
Add Pages
Site Menu
On the left-hand side of the Editor, click on MENU :
-
Click on the blue ADD PAGE button
-
Try adding the following pages: “Articles”, “Illustrations”, and “Videos”
You can keep these new pages as individual, stand-alone pages on your portfolio. Or, you can nest them all under the WORK page by making them subpages.
Add Subpages
-
Select “Articles”
-
Click on
-
Choose SUBPAGE
-
Repeat this for “Illustrations” and “Videos”
Site Menu after adding subpages
Add a Menu
After creating multiple pages, you’ll want to provide your audience with a navigation tool. That is, the Menu feature allows users to move between different pages.
Menu Feature and Customization Options/Icons
When you drag and drop the desired menu to the page, the following options and icons appear:
-
MANAGE MENU
-
NAVIGATE
-
LAYOUTS
-
DESIGN
-
ANIMATION
-
STRETCH
-
HELP
Whenever you add a new element to the page, most of these options and icons become available. In fact, LAYOUTS, DESIGN, ANIMATION, and STRETCH are standard and appear in almost all elements. Another common one is SETTINGS . These options allow for more customizing.
Here's a tip!
It’s trial and error time! Sometimes, the best way to learn Wix’s features is by trying an option, seeing if it works (or not), and then trying something different. For example, to animate an element, try the “Bounce-In” or “Fade-In” options (my personal favorites). In the top, right-hand corner of the Editor, click PREVIEW to see this feature in real time. If it doesn’t get your seal of approval, try another one! It may be a little time consuming, but it’s an easy way to play around and familiarize yourself with Wix’s features.
You can toggle more of the menu’s settings. For a detailed account, please visit Wix’s Help Center.
The About Page
Now that you’ve let your work shine, it’s time to cast the spotlight on you. The About page is the designated space for telling us who you are and what your story is.
You may personalize your About page as you like, but perhaps consider including:
-
A summary of you and your story
-
A recent picture of you
-
Achievements, degrees, honors, etc.
-
Links to a resume and social/networking sites
Some of the previous sections (i.e., text boxes and adding images) may be useful instructions for including a summary, a list of achievements, or a picture of yourself. Please revisit these sections by scrolling up; to revisit the list of Contents, click on the blue arrow(s) near the bottom, left-hand corner of the page.
Add Social Tools/Bars
On the left-hand side of the Editor, click on ADD :
-
Select SOCIAL
-
Drag and drop the desired social bar to the page
-
Click the SET SOCIAL LINKS button
Here's a tip!
You can also add single icons for individual social sites; however, your options are limited with these single icons. At least with the Social Bar, you can add as many or as little social sites as you wish.
In the SET SOCIAL LINKS menu, you can:
-
Add more social icons by clicking on the orange ADD ICONS button
-
Remove icons by selecting or hitting DELETE on your keyboard
-
Switch the order of the icons by dragging
-
Replace the icon’s image
-
Change the icon’s title
-
Link to your social site with a web address
Set Social Links Menu
Parting Advice
Why hello there, fellow Wix user! After getting through this guide, I think you deserve the title.
First, I should mention that there is so much more to a portfolio than what I’ve detailed here. My hope, however, was to introduce you to the foundation of a strong portfolio—the Work and About pages. For me, understanding how to showcase your best work and illustrate your story is the crucial first step. Once these are in place, then you can start thinking about the other "bells and whistles.”
This Q&A and this article might shed some light on what those “bells and whistles” are.
Wix also offers many more features than what I’ve listed here. Again, my goal was to introduce you to the features that would be most helpful for building the core components of your portfolio. But once you feel comfortable enough with Wix, I highly encourage you to experiment with their interactive elements. They can be a little tricky at first, but with a little trial and error, I’m sure you’ll get the hang of it!
These resources provide instructions for some of my favorites: slideshows and hover boxes.
Remember when I (briefly) talked about design aspects? I only dedicated one section of this guide to the topic because it wasn’t where I wanted your focus to be. Instead, I wanted you to pour all of your attention into the basics and introductory features; I wanted you to focus on you and not the design. However, if learning more about design principles will be an aid to your journey with Wix and portfolio/website design, who am I to stop you?
You don’t need to be a designer to understand this article. Meanwhile, this book’s title says it all.*
*This book is also available for rent through Chegg!
References
“4 Secrets to Building a Portfolio That’ll Make Everyone Want to Hire You.” The Muse, https://www.themuse.com/advice/4-secrets-to-building-a-portfolio-thatll-make-everyone-want-to-hire-you. Accessed 22 Mar. 2018.
Frost, Aja. “Design 101: How to Make Great Graphics Without Design Skills.” Zapier, https://zapier.com/blog/learn-design-elements-basics/. Accessed 22 Mar. 2018.
“How to Add, Edit, Customize & Link Text.” YouTube, uploaded by Wix.com, 5 Feb. 2017, https://www.youtube.com/watch?v=0Ym88PZdflk.
Smith, Jacquelyn. “Why Every Job Seeker Should Have a Personal Website, And What It Should Include.” Forbes, https://www.forbes.com/sites/jacquelynsmith/2013/04/26/why-every-job-seeker-should-have-a-personal-website-and-what-it-should-include/#3ff078db119e. Accessed 22 Mar. 2018.
All Images, Screenshots, and Portfolio Examples:
Wix. Wix.com, Inc., 2018, https://www.wix.com/. Accessed 22 Mar. 2018.
All Wix Tutorials:
“Wix Help Center.” Wix, https://support.wix.com/en/the-wix-editor. Accessed 22 Mar. 2018.
Wong, Jeremy. “13 Key Things To Know Before You Use Wix.com - Wix Review 2018.” Website Builder Expert, https://www.websitebuilderexpert.com/wix-review/. Accessed 22 Mar. 2018.
Zimmerman, Eilene. “Showcasing Your Work, in an Online Portfolio.” The New York Times, http://www.nytimes.com/2012/07/01/jobs/an-online-portfolio-can-showcase-your-work-career-couch.html. Accessed 22 Mar. 2018.
About the Author
Danielle Huliganga is an undergraduate student at Cal Poly, San Luis Obispo, who is a quarter away from obtaining her B.A. in English.
As a graduating senior, she set out to create a space for her best work. While developing her online portfolio, she had the chance to reflect on all her college opportunities.
Now, she can only hope that the gratitude she feels is reflected in her work here.
Site Menu after adding new pages