The Publishers is building the 'professional network for journalists and bloggers'.
This is something I built from scratch. It's responsive, and a very large project. I led a team of designers and developers. I'm going to run you through one of the key parts of the project with the process that was used to optimise it from a UX / IA perspective.
- The platform was getting lots of people searching for profiles but sign ups were almost non-existent.
- There had been an internal KPI change to better reflect sign ups rather than searches.
- Our forgot password system was temporarily broken. No one likes passwords, so we wanted to come up with a better solution.
- Get far better sign up conversions and find an improvement to password management.
Before going any further, it's worth taking note of the persona that was developed for this project. It helps us identify who we're building this for and what problems they're trying to solve. I didn't develop this persona for this particular task. I developed it earlier, however, I thought it was worth showcasing regardless.
I started with LinkedIn, as they have legendary growth and it's clearly relevant to what The Publishers is building. We ran a few people through the sign up process and recorded their experience.
Most generally thought the process was fairly seamless though people had a certain level of distrust and confusion when it came time to enter their email to identify friends already on the platform. This is how LinkedIn grows their platform and it was one of the mechanisms we were planning to use to grow as well.
Next up was ResearchGate which is a professional network for academics. They buried their invitation system a lot more than LinkedIn. No one noticed it when we ran tests.
We noticed that on both platforms, they made it incredibly hard to enter the website without signing up. From their homepage, it was actually impossible. They had a brief introduction as to what their value proposition was and a clear CTA to sign up.
We had links all over our homepage and a big search box to find profiles. Clearly this was wrong with our new KPI.
You can see in the screenshot below all of the links, search box and a pretty unclear, crappy value proposition.
We got rid of the search box and improved / clarified the value proposition. We kept the featured profiles and categories, but took the links off to showcase the caliber of profiles the platforms have and the categories it focuses on.
We felt the new value proposition was so much better, there was no longer the need for a 'How it works' button. We ran this by a few extra people and we were wrong. Most people wanted a learn more section before signing up. We didn't have time for it during this build, however, we now know we need to build that section to reflect the new propostion.
We also noticed that all of professional networks we checked made it very clear their platform was free to use. We thought we'd pick up on that as there is clearly a good reason they all use it.
The only way to enter the site was to join.
To make up for the lack of links and problems with SEO crawling, we created an in-depth sitemap with a far better link structure.
Now that we had a good idea of what similar platforms were doing and how we could improve things, we decided to do a sitemap to outline the core pages we thought we needed to improve the sign up process and forgot password. You'll notice that forgot password no longer exists in this sitemap. We found a way to get rid of passwords altogether by having users sign in with the email address only. We then send them an email with a link which signs them in. We managed to kill the need for a password : )
Next up was user flows to better outline how these pages would work together and also identify where things were going wrong.
After some internal testing on the sitemaps and user flows, we were confident to move ahead with hand-drawn sketches. This was an iterative process and at times frustrating as we felt we knew exactly what we wanted and needed to dive straight into wireframing. We did this step regardless and I'm thankful as there were a few mistakes we were able to quickly rectify.
It was now time to start some wireframes and unfortunately I only have the higher-fidelity version of this as we felt we had done most of the iterative steps in the hand-drawn section.
All wireframes were designed mobile first and scaled up to desktop.
After further testing on the wireframes, it was time to put them into Marvel for prototyping. Sketch was used for the high-fidelity wireframing so it integrated very well and made the process incredibly seamless.
The new sign up / sign in process is going incredibly well with user testing. They love the fact that they no longer need a password and have generally been pleasantly surprised by our new solution. One of our testers said 'Why isn't every website doing sign in like this?'.
It should be live on www.thepublishers.com in the next week.