BRIDGEGOOD.com gives student creatives the professional resources to discover tech jobs and secure meaningful design careers. Businesses receive essential services helping students build skills while improving diverse local economies.
BRIDGEGOOD is a nonprofit organization supported by Google.org.
Company
BRIDGEGOOD
Role
UX/UI Designer
Project Type
UX/UI Design
Design Systems
Duration
3 Weeks
Year
2019
The Overview
Rebuilding a portfolio site
BRIDGEGOOD’s platform plays as a link between emerging talent and industry-leading creatives. Their mission is to enable underprivileged, underrecognized artists of all professions to get the recognition they deserve and land tech jobs with some of the largest companies in America.
BRIDGEGOOD supplies a platform for creatives to display their work. An issues we noticed among many different users’ account portfolio pages is their is a lack of retention. Users were creating BRIDGEGOOD accounts, but they weren’t staying engaged on the website or uploading their work. We aimed to design something that would entice users to use BRIDGEGOOD. I worked with the project manager, 4 other designers, and an engineer. We were tasked with
Redesigning a portfolio platform the would entice users to utilize BRIDGEGOOD’s portfolio feature more
Solution
We minimize the amount of branding that was on the project display page and reconstructed the layout of project components of users’ artwork in a manner that excites users to upload their work and showcase their talents. In addition, we increased custom-ability with the story telling by increasing text limits and allowing for elongated captions for images.
My Contribution
I was a part of a team of five designers, one project manager, and one developer. I partook in the entire-end-to-end process where I conducted user interviews, conducted sketch sessions such as crazy 8’s with my team, and took charge in building the wireframes and high fidelity prototypes. With our finalized creation, I presented our designs to a group of 50 stakeholders of BRIDGEGOOD at the Google Headquarters.
Our Design Process
The Research
Learning about our users to a science.
To properly tackle the issue at hand, it was important that we truly understood who our users were.
User Interviews
My team and I conducted user interviews with 12 BRIDGEGOOD creatives who use our platform. The most pivotal insights received from our users were:
01
11/12 Users felt that the BRIDGEGOOD branding overpowered the work displayed on the user’s project display page.
02
There was a dissatisfaction with the layout of their work on the BRIDGEGOOD platform. Small square thumbnails were very underwhelming to our users. 9/12 users felt that BRIDGEGOOD lacked flexibility with project layout.
03
BRIDGEGOOD’s portfolio platform didn’t allow for effective story telling to our users. They highlighted that being a creative is all about being able to tell the story of the project. 10/12 users felt that the text limit on their projects were too limiting.
Competitive Analysis
After user interviews, we conducted a competitive analysis to see how our competitors handled their portfolio platform with a larger stream of users. We wanted to identify UX/UI trends that worked well on a portfolio platform while taking note of things that didn’t work well. Here are the four businesses we looked into.
Competitive Analysis Takeaways
Behance
Behance had very large image blocks that instantly followed the option to create a seamless storytelling experience for their users. Being that this was something we were aiming for, Behance’s platform supplied a potential solution to our problem.
Dribble
The variation in the sizes of the images seemed very successful. The large space that was exclusive to the image, following a responsive relationship of supporting text under is something that seemed to establish visual variation and interest.
Adobe Portfolio
Similarly to Squarespace, the method of integrating their brand in a minimalist way was a key highlight. Also, we paid attention to some of their templates. We saw which visual compositions were preferred based on popularity.
Squarespace
With Squarespace, a website portfolio creation platform, we noticed their success with integrating their brand in such a minimalist way that still establishes presence, but also allowed for their users to truly express themselves.
The “Define” Process
Scoping in to target the user’s problem.
The initial research phase played a vauable role in this next step, as it allowed us to recognize painpoints and empathize with our users. We were able to move into identifying the problem at hand.
Problem Statement
Next, we mapped the problem and formed a concise statement that pinpoints the concerns of our users. The problem statement that we have concluded with is:
How might we create a portfolio feature that allows users to express their personalities through storytelling and artwork to ensure website retention?
User Persona
An archetype of what an early-career creative looks like on the BRIDGEGOOD platform was the next step.
User Journey
The user's journey was created after a series of story boarding sessions that took place with the entire team.
The Ideation
Imagining solutions to address user’s problem.
We utilized our research and problem defining information to curate design solutions.
Sketches
My team and I went through two series of Crazy 8’s. Coined by Google, Crazy 8’s is a sketch exercises where you develop 8 solutions to a user’s problem in 1 minute. After, we presented our concepts to one another with a voting session of the best solution following there after.
Wireframes
With our solution chosen, we moved into transforming the them into low fidelity wireframes.
The Design
Bringing the design to life.
It was time to focus on the designs, typography, and various other graphical elements to bring the design solution to life.
Typography & Color Pallet
The typography and color pallet aimed to uphold the design system that my team and I had created previously.
Iconography
The selected icons were kept consistent with what is used at Google; the Google Material Icons. You never can go wrong with simple and clean lines.
The Solution
An easy-to-fit portfolio, for all.
The final product was finally here. It aimed to give users that freedom that they’ve been wishing for.
01. Highlight Your Best
Highlight your favorite project in the project creation feature
Have your best foot forward when potential employers visit
02. Tell Your Story
With a substantial increase in character limit, tell your story how you see fit
Add text with each category of your project.
03. Show All of Your Cards
Fill out your CV (Resume) on the platform to give employers an instant view on what you’ve achieved
Highlight your industry skills and what services you can provide
Prototype
Here is a short video with a very brief run through of what the pages look like.
The Old versus the New
The old version and the new version have quite the contrast. The old version tended more towards the needs of the business while this new version tends to the needs of the user, which is how it should be when it comes to a personal portfolio.
The Conclusion
Final thoughts & next steps.
We brought our discoveries and processes to 50 of our stakeholders at the Google Headquarters. We went in-depth about the newly added features and revamped experiences of the portfolio feature. We received positive feedback from our audience, with majority voicing there excitement for the newly-born portfolio experience.
A person’s portfolio isn’t just a place to display work; it is an open vault used to express their personality and principles. For a lot of hiring managers of artists, the portfolio is the very first impression they get of a potential candidate. It's important that platforms keep this in mind when establishing tools that enable users to house some of their most expressive and prized work.