I am going to create my first project for my ui/ux portfolio. I wanted to start with a website and then i will get into phone and tablets for future projects. How do I make sure that it's perceived as a UX portfolio and not a Web Design portfolio?
Firstly, this isn't quite a UX question, but since you're kind of asking about the User Experience for the recruiter/client who will see your portfolio, I'm going to try to respond to it in that context. When it comes to it, a portfolio is a portfolio is a portfolio... it's just a load of stuff you've done, from which the client can extrapolate what information they require: so let's focus on the UX of someone looking at a UX portfolio.
So whether it's for web or UX, it's still going to be essentially the same portfolio, but you can make sure you include the right context and focus.
Even if you submitted a purely web portfolio when going for a UX job, the recruiter would know what they're looking for and there's enough overlap between Web Design and User Interface consideration that they'll understand your skillset, so I wouldn't worry about it too much. That said, it does absolutely no harm to take the time to frame things nicely for them, ensure that you're emphasizing the aspects you (and they) most care about, and guide them to the impression you're looking to convey.
Show it on different devices and interfaces, with clear comments and evidence of the changes made for different devices. Frame your portfolio as a "This is the user experience I provided within these Web Applications" guide, and make sure that you're showing how the UX changes.
Alongside the "Whole App" shots, show smaller, more focused screenshots etc of specific UX features, things you've thought about and problems you've solved. Take the emphasis away from pure design (which they'll see anyway, whether you bring attention to it or not) and put it on the way you considered the user. The user notices the design too, we're all aware of that, so try to really show how you've thought about the user.
If what you're showing is just a finished product, then there is no difference between a UX and a design portfolio. If you want to show a UX portfolio, you need to justify the changes made from a UX perspective.
The best way that I have seen of this is to communicate the process that you followed and show intermediate steps with sketches and notes showing (in no particular order):
- what the problem areas were
- how you determined they were problem areas
- what you did to validate that your solution was better
- possible persona's used
- use case analysis
- usability testing both before and after
- solutions that weren't used
It's mostly not about the finished product, but rather about how you got to that product and how much better it was than the start.
The difference is whether you're applying for a UX role or a Graphic Design role.
It's a spectrum with most people falling somewhere in between the extremes.
On one extreme, for a pure visual designer, it may be screen shots only. On the other end, for a pure UX designer, it may be purely information schematics and research data.
Most people do some amount of both, however, and the differences then become almost moot. It's more about how you describe the work your showing, your role in the work, and how you contributed to the end result.
Same basic answer, different words
- Jobs to be done
- The users doing those jobs
- How the jobs will be done
- The metrics used to track success
UI design (or web design) applies
- Visual style to guide the user down the UX path
- A branded layer over the functionality
The portfolio speaks for itself
You can use any title you like on the page. The story your portfolio tells will decide which category you fall into. In my experience, the visual manifestation of a portfolio does end up being about the finished product. The difference is in how you describe it in text and what supporting images go along with it.
A UX portfolio shows wireframes (preferably annotated), functional flows, use cases, user personas and more. You should be able to answer questions of why and how you solved problems. Among the tools used in creating the items for this portfolio are paper and pencil; Visio, wireframing tools (example: Balsamiq, Axure) and graphics tools (example: Photoshop, Illustrator); HTML.
Ideally the portfolio will show a variety of product types; from low-fidelity mockups to high fidelity presentations.
A web design portfolio shows the final product - usually only very high fidelity, pixel-perfect presentations.
So, for example - as a web designer you would take the wireframe I put together and breathe life into it.
I, as a UX/UI guy don't spend time agonizing over typography and color. I care about typography and color but my wireframes don't reflect that. I solve the business users problems; select the ui; work on its functionality (example: "so when you click here -that div over there is revealed").
In short: a UX portfolio shows lower fidelity wireframes. A web designer's portfolio shows the final product.
In real life lots of people wear different hats over their career and portfolios often cross the gamut between UX and Web Design and Graphic Design.