Ux Design How to Make Portfolio Website
When applying to design jobs, the portfolio is an absolute requirement. A portfolio demonstrates how you present your work and approach UX projects. In a way, your design portfolio is a proxy for both your technical skills and soft skills.
Therefore, where you choose to create your portfolio has a (BIG) hand in the flexibility and capabilities of building the portfolio experience you want to provide.
Here are the main contenders I'll be discussing: WordPress, Squarespace, and Webflow. Obviously, these are not the only options and I'll bring up some other platforms.
Website builder vs portfolio builder
Before we dive too far in, let's distinguish between 2 major tools in building design portfolios. Website builders — the category of most of our recommendations — are all-in-one tools that'll give you not only the flexibility to host and design your UX portfolio, but also build a blog, eCommerce store, web presence…you get the point.
Compare that to tools like Medium, Google Slides, or even directly in Figma. These aren't full-fledged websites but have the minimum requirements of hosting your work so you can send a link to your work for someone else to view.
If learning how to use a new website builder is oversized for what you need right now (got a UX interview in a few days?!), read the Minimum Viable UX Portfolio for advice.
If you're ready to build out a full web presence, then let's dive in:
WordPress vs Squarespace vs Webflow compared for Design Portfolios
| WordPress | Squarespace | Webflow | |
| Learning curve | Medium | Low | Medium |
| Level of simplicity | Simple for blogging; complex for portfolio | Really simple | Simple |
| Development time | Average | Fast | Fast |
| For developers | Awesome – custom CSS | Great – HTML, CSS, Javascript | Great – tools like flexbox and CSS grid |
| For designers | OK. WordPress themes and plugins can help you accomplish anything | Awesome – drag-and-drop feature | Awesome – familiar design UI |
| Pricing | Free at WordPress.org, paired with a cheap web host | Medium – personal plan is $12/month | Medium: free to start, pay for what you need (basic plan is $12/month) |
| Built-in templates | Yes | Yes | Yes |
| Blog | Yes | Yes | Yes |
WordPress is a content management system (CMS) that's been around since 2003. It's a well-established leader in the industry and often a go-to option. Note that WordPress.org is totally free and comes as a 1-click installation with hosting services like Siteground (what UXB uses). For most people, going with their own hosting is the cheapest option, starting for $3.99 and up.
WordPress is oriented around building a blog first, so the building blocks are posts and pages. This means that WordPress also has the best SEO (search engine optimization) we've seen compared to other website builders, which can really help you get discovered if you're building a personal brand.
Since WordPress is open source, there's a huge marketplace for plugins, themes, and tools both free and paid that could turn your website into whatever you want. One part could be eCommerce, another part could be a forum…the options are quite limitless.
However, there is a higher learning curve that comes with WordPress, since it's a "blog-first" website builder.
Luckily, there's a plugin called Elementor – a page builder that makes WordPress as easy to customize as SquareSpace or Wix. It comes with useful widgets and allows for drag-and-drop so you can visualize exactly how your page will look.
In general, WordPress can take your portfolio site to greater heights with some pretty powerful tools and plugins. But if you care to dive into the "behind-the-scenes", you'll want to have developer expertise to help you sift through the code.
Who's it for: The designer not only wants to build a portfolio, but a website that's extensible and can serve as a blog and create long-term web presence (SEO). A good fit for any UX designer who's continuously documenting work – articles, presentations, small projects, etc.
Squarespace has actually been around since 2004 and right after WordPress, it's definitely a popular option. Squarespace has 6 values that they apply strive to convey to their users:
- Be your own customer
- Empower individuals
- Design is not a luxury
- Good work takes time
- Optimize towards ideals
- Simplify
Similar to WordPress, Squarespace offers dozens of templates to select from to get started and their websites are mobile responsive. No matter what theme you choose, it will be mobile responsive! Switching between templates is easy and your content stays. However, you might have to rearrange pages or recreate a sidebar.
While Squarespace is generally liked for its simpliciaty, it has potential to become really expensive given its limitations with customization and lack of external apps. While you can add some lines of HTML, CSS, and Javascript, it doesn't have the full flexibility for you to code custom features. Another limitation is that there's no autosave feature for your pages or posts so if you've put together your long case study and get disconnected… You better hope that you've got a backup copy somewhere else!
Generally, I think Squarespace is a good place to start if you're pressed on time, like in a bootcamp or wanting to swing together a portfolio really quick to apply to a job. In the long-run, I personally think you'll want a platform that will provide more than a cookie-cutter feel.
Webflow is a newer platform founded in 2013 and it has quickly become the go-to platform for designers who want a more robust site building option. What Webflow does is it marries coding with drag-and-drop to provide a flexible building experience. On top of that some of its key features include automatic saving so you can work on-the-go, extensive customer support with Webflow University, and export anywhere option for you to host your website on any platform you'd like.
While there are extensive resources to get started in Webflow, there are a few things I've personally noticed – the learning curve and basic structural understanding. With the limited templates that Webflow offers for free, there's not a ton of scaffolding to get you started. You'll want to understand the Box model and what divs/containers/sections/classes do because it'll help with how you bring design elements into the main canvas. For me, I always plan out my website on paper first. Then, I move into Illustrator, Adobe XD, or Figma to make that design come to life. Finally, I prepare my assets and content to assemble in Webflow. In a sense, I feel like I'm doing an end-to-end website build that I'd do for clients. I have some experience in coding and using Adobe Dreamweaver so looking at the Webflow editor, I'm pretty surprised that I don't have to code to get my design to the precision that I want.
If Webflow is peaking your interests, here's an article to help you get started!
Of the 3, here's how I'd rank them:
- Webflow
- Squarespace
- WordPress
Yup. I'd rank the platform I'm the least familiar with first because I think that Webflow has the most flexibility and potential to support a UX designer's design process. I've worked with many WordPress sites and they're all pretty different depending on the choice of plugins. WordPress will probably be my day-one tool but in the interest of building a portfolio you're proud of and have the most control over, I have to say Webflow looks most promising. Squarespace is a good place to start if you're looking for low-commitment and practice somewhere because it's probably the easiest to use of the 3. I'd say after you get a good feeling of what you've built in Squarespace, move into WordPress or Webflow next.
What are other options?
There's more tools out there to build your portfolio, I'll go over some quickly.
Wix – Wix has a lot of plugins and templates that can help you build your site. I played around with this in high school through early college to showcase some of my graphic design work. I stopped using it because I craved more ability to edit layouts and make precise adjustments, which became a time-suck to figure out.
Weebly – Very similar to Wix and Squarespace but quite limited on flexibility. It's drag-and-drop options limit what you are able to add to the canvas and where you can add it. Another note is that Weebly blocks certain international traffic for China, Ukraine, and Russia.
Adobe Portfolio – If you're paying for Adobe CC and have a Behance page, I would highly recommend giving Adobe Portfolio a try because it seamlessly imports your existing feed of case studies and projects. However, you can't use any custom HTML or CSS to design and navigating the editor was not very intuitive for me.
UXfolio – I've heard of UXfolio as an awesome social platform to showcase your work because it's easy to write up case studies and present your work. However, in some of the samples I've seen online, I'm seeing very cookie-cutter layouts and some very obvious "Made with UXfolio" logos, which I'm personally not a fan of.
Dribbble – Dribbble is like a newsfeed of what you're currently working on. I love exploring work for inspiration but I wouldn't consider this a portfolio space because there's not space to write about your design process.
Behance – Behance is great for showing your design process but it doesn't always link your work from another platform so it would be some copying and pasting. Therefore, I'd put up work on Behance as a repertoire of projects but highlight what I want potential employers to see on a separate site.
Instagram – I love following designers on Instagram to see what their design process looks like in the moment but I can't imagine this being a great location to convey a case study. If you're big in UI and creating bite-sized info pieces to reach larger audiences, this is a good platform for you.
Medium – I've seen a lot of case studies on Medium and honestly, I might move some of my older case studies onto Medium as I figure out my new portfolio game plan. I like that it can be searchable and I love writing articles but, Medium is for written work and I think it's a nice social media link for my portfolio, not where my best work is showcased.
For the design industry, an online portfolio is like a supersized business card that serves as an essential networking tool and a supplement to the general resume and cover letter requirement. Therefore, having a portfolio is important but making the decisions for how it looks is even more important. If you've made it through this article and are still indecisive about getting started, just pick a platform and give it a try to see which one fits your needs and abilities.
Once you've got something you're happy with, check out our Top 10 UX Portfolio Best Practices, iterate, and start applying to those jobs! What website builder do you think is the best? We want your opinion, reply in the comments or from our email newsletter.
Ux Design How to Make Portfolio Website
Source: https://www.uxbeginner.com/where-to-host-ux-design-portfolio/