Signed in as:

filler@godaddy.com

Account

Case Study 3: Frustrating Login

The Challenge

The call desk received many user complaints about unclear login errors, complex password requirements, and a confusing interface. My design supported a new visual identity and a clearer user flow for visitors while removing unnecessary obstacles.

Goals

Exploration

Requirements

Gain a better understanding of best practices of usability and functionality of Login through heuristic and competitive analyses.

Requirements

Gather requirements to help improve the rate of successful logins by decreasing login errors, customer complaints, and password reset requests for the organization’s website and application.

ROI

Requirements

ROI

Determine if the new design will benefit users and make the Login and password reset process easier.

Research Methods

Stakeholder Interview

I began the process by interviewing stakeholders to synthesize the vision for the Login page and to gain a better understanding on how it aligns with the overall business goals. Discussions also involved how we could measure success (and failure) of the design.

Competitive Analysis

Stakeholder Interview

I collected and compared data from competitive websites in the marketplace with a similar user base in order to highlight strengths and weaknesses of the current design and make more informed decisions about the redesign strategy.

Heuristic Analysis

Stakeholder Interview

Heuristic Analysis

I evaluated the Login interface and inspected the Login process and compared the outcome to a list of standard recognized usability principles.

Insights

Stakeholder Interview

During stakeholder interviews, I obtained documented user feedback via logged user complaints from the company call center. The user complaints revealed the following complaints:

Ambiguous Login error messaging
Confusing password reset process
Unclear landing pages (users unable to clearly determine success/failure)

Competitive Analysis

I conducted an analysis of seven competitors and evaluated their strategies to determine the strengths and weaknesses of their Login designs and interface. The analysis revealed that our competitors had a more efficient Login process as well as clearer feedback loops for users attempting to reset their passwords. The analysis revealed the following trends:

Two-step verification
Sign up/login through social media account
Login utilizing phone number option
Clear access to Register button but distinguish from Login
Alerts users when email doesn't exist, caps-lock is turned on, or password is too weak
Password rules easily accessible
Users informed of typos or typos are auto-fixed
Users alerted of whether specifically username, email, or password is wrong

Heuristic Analysis

The Heuristic analysis revealed the following pain points:

Register is not imminently clear (currently a text link)
Use of security questions creates potential for user frustration
Difficult to recover credentials/login if username or password is forgotten

Additionally, the design did not consider current trends and best practices.

Mapping the Flow

My team and I utilized user flows to help map out the bigger picture for each target user. After determining all possible flows, I then focused on redesigning each potential landing page throughout a user's journey.

Ideation to Launch

Sketching

I used Balsamiq to virtually draw out and externalize ideas, which could then be shared with the team. Once sketches were discussed and reworked, we touched base with the stakeholders. The sketches allowed us to ask follow-up questions during these meetings that would help clarify in more details. Whether it was allowing the primary stakeholder to express a vision or seeking clarification from the developer - we used sketching to help get us on the same page.

Transforming Wireframes

I designed several iterations of approximately 38 wireframes, which were frequently reviewed with my team and the primary stakeholder. Once we came to a consensus in the overall structure, information architecture and flow — we were able to focus on really developing the UI components and copy/content.

An initial draft of the redesign included social media login as an option. The problem here was that we currently did not have the technical capacity to execute such a login due to limitations within our database systems. For the same reasons, we were unable to implement login with SMS. However, I was able to be more flexible and expressive with the error messaging design. I was responsible for overseeing this project and ensuring the final illustrations were in line with our overall vision. It was important that these were clear, concise, and easy. The final illustrations represent a more holistic image with a fresh, clean tone.

Login Wireframes

Original Design

Create an Account Wireframes

Original Design

Outcomes

fewer assistance requests to IT Call Center

Significantly fewer users called the call center for login and password retrieval assistance.

Positive User Feedback

fewer assistance requests to IT Call Center

In a post-launch survey, users reported high satisfaction ratings and positive comments of the redesign.

Stakeholder Satisfaction

fewer assistance requests to IT Call Center

Stakeholder Satisfaction

The primary stakeholder personally congratulated our team on a successful launch. The project's success earned us a new client for future projects.