BrowserID review of mobile experience

•Download as KEY, PDF•

0 likes•515 views

Crystal Beasley

Technology Design

Case Study from Jared Spool

[checkout]

login or register

payment info

success

How many
users
did the log-in
form cost?

Some rights reserved by striatic

[checkout]

login or register

payment info

success

Our solution has to be easier than it is.

clicked [next]

• superﬂuous page

• Page should not be scrolled
down.

• Footer is missing.

clicked [verify email]

• Left-align for greater legibility.

• Make 1st and 2nd lines more
prominent.

• Shorten and simplify the copy.

switch to Mail.app

• Get RP name to use in subject
line and in body.

• The linkiﬁed URLs are
preventing the user from
immediately ﬁnding the correct
link to click.

click URL

• Email address is too low
contrast.

• Remove underline from button.

• Footer is strangely aligned.

clicked [ﬁnish]

• Close keyboard so the page
content can be seen.

closed keyboard

• Remove top nav to prevent
users from failing to complete
the registration with the RP.

• Redirect user to RP.

• The ideal ﬂow would make this
page superﬂuous.

closed window

• User was logged in already.

• Seems to only work half of the
time?

iOS
add second email to existing BID proﬁle

clicked [sign in]

• Horizontal space problems.

• Text wrap is badly handled.

• [This is not me] and
[Use a different email] do not
adequately convey their
meaning and usage.

clicked
[Use a diff email]

• Users won’t know they have a
proﬁle and the language
inconsistency doesn’t help
them build a correct mental
model of our system.

clicked [add]

• [use another email address] is
inheriting the wrong css. Look
different across browsers.

• Support the back button for the
case of user typing the wrong
email address.

clicked [url]

• Header padding

• Remove navigation

• Incomplete copy

• Redirect to RP.

General

• Android and iOS rendered the pages similarly. Screenshots here are from iOS
devices because it’s maddeningly difﬁcult to do them on Android.

• Enable back button.

• Add spinner on submit actions to communicate system state.

• Avoid technical jargon like “Communicating with server.”

Legibility

• Body fonts +1px in size

• More contrast between font and background

• Make links in text look more actionable

• Buttons

• More contrast between primary button colors and hover states

• Increase kerning of button text

• Increase size of button text

Flow

• The current interaction breaks the pattern of asking for email and password,
then verifying the email.

• Shorten the ﬂow.

[sign in]

enter email

[next]

[verify email]

conﬁrmation

open email

[URL]

type password

[ﬁnish]

close window

success

[sign in]

enter email

[next]

conﬁrmation

open email

[URL]

type password

success

[sign in]

enter email

[next]

type password

conﬁrmation

open email

[URL]

success

[sign in]

enter email
[sign in]
[next]
enter email
[verify email]
[next]
conﬁrmation
type password
open email vs.
conﬁrmation
[URL]
open email
type password
[URL]
[ﬁnish]
success
close window

success

Similar to BrowserID review of mobile experience

Jobzella.com Website UX Map Proposal Presentation

Ahmed Alshair

Content and Quality Control

signalize

EchoSign E-Signature Winter '11 Release and New Features

Jason M. Lemkin

ISBG The 3 S's a guide to single sign on

Gabriella Davis

Simplifying The S's: Single Sign-On, SPNEGO and SAML

Gabriella Davis

I C T for JHS 3

Abacheng Ghadafi

Selection of email system and creating an email account

Mary May Porto

Email (3)

markilyn

A guide to proofing on Wrike with Moirae.pdf

ArturTorresdeMelo1

Using internet

Pyae Thar

Agent web site_set_up_guide v2

Falcon Homes

JibberJobber Quickstart Guide

jasonalba

JibberJobber Quick Start Guide

jasonalba

Digital Signatures in Odoo 13

Varsha Technaureus

E Mail Business Proposal PowerPoint Presentation Slides

SlideTeam

Whether you work on a traditional or a modern Agile/DevOps project, many test automation practitioners find that automated tests can be cumbersome and costly to manage and maintain. An often overlooked factor is the lack of test design. Most organizations are unaware the critical role that test design can play in making automation scalable and maintainable. In this joint webinar, Hans Buwalda, CTO of LogiGear and Titus Fortner of Sauce Labs discuss how one can use best practices to create well-organized tests that are easy to read and can be automated in an efficient and maintainable way.

Test Design Essentials for Great Test Automation - Titus

Sauce Labs

141213

mayakarmon

Add Client in OfficeTimer - Fully Free Time Tracking, HR and Project Manageme...

OfficeTimer

Xceednet Bandwidth Management

Xceednet LLC

BDD - Collaborate like you mean it!

John Ferguson Smart Limited

Similar to BrowserID review of mobile experience (20)

Jobzella.com Website UX Map Proposal Presentation

Content and Quality Control

EchoSign E-Signature Winter '11 Release and New Features

ISBG The 3 S's a guide to single sign on

Simplifying The S's: Single Sign-On, SPNEGO and SAML

I C T for JHS 3

Selection of email system and creating an email account

Email (3)

A guide to proofing on Wrike with Moirae.pdf

Using internet

Agent web site_set_up_guide v2

JibberJobber Quickstart Guide

JibberJobber Quick Start Guide

Digital Signatures in Odoo 13

E Mail Business Proposal PowerPoint Presentation Slides

Test Design Essentials for Great Test Automation - Titus

141213

Add Client in OfficeTimer - Fully Free Time Tracking, HR and Project Manageme...

Xceednet Bandwidth Management

BDD - Collaborate like you mean it!

Recently uploaded

The 7 Things I Know About Cyber Security After 25 Years | April 2024

Rafal Los

💉💊+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHABI}}+971581248768 +971581248768 Mtp-Kit (500MG) Prices » Dubai [(+971581248768**)] Abortion Pills For Sale In Dubai, UAE, Mifepristone and Misoprostol Tablets Available In Dubai, UAE CONTACT DR.Maya Whatsapp +971581248768 We Have Abortion Pills / Cytotec Tablets /Mifegest Kit Available in Dubai, Sharjah, Abudhabi, Ajman, Alain, Fujairah, Ras Al Khaimah, Umm Al Quwain, UAE, Buy cytotec in Dubai +971581248768''''Abortion Pills near me DUBAI | ABU DHABI|UAE. Price of Misoprostol, Cytotec” +971581248768' Dr.DEEM ''BUY ABORTION PILLS MIFEGEST KIT, MISOPROTONE, CYTOTEC PILLS IN DUBAI, ABU DHABI,UAE'' Contact me now via What's App…… abortion Pills Cytotec also available Oman Qatar Doha Saudi Arabia Bahrain Above all, Cytotec Abortion Pills are Available In Dubai / UAE, you will be very happy to do abortion in Dubai we are providing cytotec 200mg abortion pill in Dubai, UAE. Medication abortion offers an alternative to Surgical Abortion for women in the early weeks of pregnancy. We only offer abortion pills from 1 week-6 Months. We then advise you to use surgery if its beyond 6 months. Our Abu Dhabi, Ajman, Al Ain, Dubai, Fujairah, Ras Al Khaimah (RAK), Sharjah, Umm Al Quwain (UAQ) United Arab Emirates Abortion Clinic provides the safest and most advanced techniques for providing non-surgical, medical and surgical abortion methods for early through late second trimester, including the Abortion By Pill Procedure (RU 486, Mifeprex, Mifepristone, early options French Abortion Pill), Tamoxifen, Methotrexate and Cytotec (Misoprostol). The Abu Dhabi, United Arab Emirates Abortion Clinic performs Same Day Abortion Procedure using medications that are taken on the first day of the office visit and will cause the abortion to occur generally within 4 to 6 hours (as early as 30 minutes) for patients who are 3 to 12 weeks pregnant. When Mifepristone and Misoprostol are used, 50% of patients complete in 4 to 6 hours; 75% to 80% in 12 hours; and 90% in 24 hours. We use a regimen that allows for completion without the need for surgery 99% of the time. All advanced second trimester and late term pregnancies at our Tampa clinic (17 to 24 weeks or greater) can be completed within 24 hours or less 99% of the time without the need surgery. The procedure is completed with minimal to no complications. Our Women's Health Center located in Abu Dhabi, United Arab Emirates, uses the latest medications for medical abortions (RU-486, Mifeprex, Mifegyne, Mifepristone, early options French abortion pill), Methotrexate and Cytotec (Misoprostol). The safety standards of our Abu Dhabi, United Arab Emirates Abortion Doctors remain unparalleled. They consistently maintain the lowest complication rates throughout the nation. Our Physicians and staff are always available to answer questions and care for women in one of the most difficult times in their lives. The decision to have an abortion at the Abortion Cl

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...

?#DUbAI#??##{{(☎️+971_581248768%)**%*]'#abortion pills for sale in dubai@

This presentation explores the impact of HTML injection attacks on web applications, detailing how attackers exploit vulnerabilities to inject malicious code into web pages. Learn about the potential consequences of such attacks and discover effective mitigation strategies to protect your web applications from HTML injection vulnerabilities. for more information visit https://bostoninstituteofanalytics.org/category/cyber-security-ethical-hacking/

HTML Injection Attacks: Impact and Mitigation Strategies

Boston Institute of Analytics

The presentation explores the development and application of artificial intelligence (AI) from its inception to its current status in the modern world. The term "artificial intelligence" was first coined by John McCarthy in 1956 to describe efforts to develop computer programs capable of performing tasks that typically require human intelligence. This concept was first introduced at a conference held at Dartmouth College, where programs demonstrated capabilities such as playing chess, proving theorems, and interpreting texts. In the early stages, Alan Turing contributed to the field by defining intelligence as the ability of a being to respond to certain questions intelligently, proposing what is now known as the Turing Test to evaluate the presence of intelligent behavior in machines. As the decades progressed, AI evolved significantly. The 1980s focused on machine learning, teaching computers to learn from data, leading to the development of models that could improve their performance based on their experiences. The 1990s and 2000s saw further advances in algorithms and computational power, which allowed for more sophisticated data analysis techniques, including data mining. By the 2010s, the proliferation of big data and the refinement of deep learning techniques enabled AI to become mainstream. Notable milestones included the success of Google's AlphaGo and advancements in autonomous vehicles by companies like Tesla and Waymo. A major theme of the presentation is the application of generative AI, which has been used for tasks such as natural language text generation, translation, and question answering. Generative AI uses large datasets to train models that can then produce new, coherent pieces of text or other media. The presentation also discusses the ethical implications and the need for regulation in AI, highlighting issues such as privacy, bias, and the potential for misuse. These concerns have prompted calls for comprehensive regulations to ensure the safe and equitable use of AI technologies. Artificial intelligence has also played a significant role in healthcare, particularly highlighted during the COVID-19 pandemic, where it was used in drug discovery, vaccine development, and analyzing the spread of the virus. The capabilities of AI in healthcare are vast, ranging from medical diagnostics to personalized medicine, demonstrating the technology's potential to revolutionize fields beyond just technical or consumer applications. In conclusion, AI continues to be a rapidly evolving field with significant implications for various aspects of society. The development from theoretical concepts to real-world applications illustrates both the potential benefits and the challenges that come with integrating advanced technologies into everyday life. The ongoing discussion about AI ethics and regulation underscores the importance of managing these technologies responsibly to maximize their their benefits while minimizing potential harms.

Artificial Intelligence: Facts and Myths

Joaquim Jorge

Strategies for Landing an Oracle DBA Job as a Fresher

Remote DBA Services

MySQL Webinar, presented on the 25th of April, 2024. Summary: MySQL solutions enable the deployment of diverse Database Architectures tailored to specific needs, including High Availability, Disaster Recovery, and Read Scale-Out. With MySQL Shell's AdminAPI, administrators can seamlessly set up, manage, and monitor these solutions, ensuring efficiency and ease of use in their administration. MySQL Router, on the other hand, provides transparent routing from the application traffic to the backend servers in the architectures, requiring minimal configuration. Completely built in-house and supported by Oracle, these solutions have been adopted by enterprises of all sizes for their business-critical applications. In this presentation, we'll delve into various database architecture solutions to help you choose the right one based on your business requirements. Focusing on technical details and the latest features to maximize the potential of these solutions.

Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...

Miguel Araújo

The Good, the Bad and the Governed - Why is governance a dirty word? David O'Neill, Chief Operating Officer - APIContext Apidays New York 2024: The API Economy in the AI Era (April 30 & May 1, 2024) ------ Check out our conferences at https://www.apidays.global/ Do you want to sponsor or talk at one of our conferences? https://apidays.typeform.com/to/ILJeAaV8 Learn more on APIscene, the global media made by the community for the community: https://www.apiscene.io Explore the API ecosystem with the API Landscape: https://apilandscape.apiscene.io/

Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...

apidays

Created by Mozilla Research in 2012 and now part of Linux Foundation Europe, the Servo project is an experimental rendering engine written in Rust. It combines memory safety and concurrency to create an independent, modular, and embeddable rendering engine that adheres to web standards. Stewardship of Servo moved from Mozilla Research to the Linux Foundation in 2020, where its mission remains unchanged. After some slow years, in 2023 there has been renewed activity on the project, with a roadmap now focused on improving the engine’s CSS 2 conformance, exploring Android support, and making Servo a practical embeddable rendering engine. In this presentation, Rakhi Sharma reviews the status of the project, our recent developments in 2023, our collaboration with Tauri to make Servo an easy-to-use embeddable rendering engine, and our plans for the future to make Servo an alternative web rendering engine for the embedded devices industry. (c) Embedded Open Source Summit 2024 April 16-18, 2024 Seattle, Washington (US) https://events.linuxfoundation.org/embedded-open-source-summit/ https://ossna2024.sched.com/event/1aBNF/a-year-of-servo-reboot-where-are-we-now-rakhi-sharma-igalia

A Year of the Servo Reboot: Where Are We Now?

Igalia

Real Time Object Detection Using Open CV

Khem

ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke

Product Anonymous

With more memory available, system performance of three Dell devices increased, which can translate to a better user experience Conclusion When your system has plenty of RAM to meet your needs, you can efficiently access the applications and data you need to finish projects and to-do lists without sacrificing time and focus. Our test results show that with more memory available, three Dell PCs delivered better performance and took less time to complete the Procyon Office Productivity benchmark. These advantages translate to users being able to complete workflows more quickly and multitask more easily. Whether you need the mobility of the Latitude 5440, the creative capabilities of the Precision 3470, or the high performance of the OptiPlex Tower Plus 7010, configuring your system with more RAM can help keep processes running smoothly, enabling you to do more without compromising performance.

Boost PC performance: How more available memory can improve productivity

Principled Technologies

Effective data discovery is crucial for maintaining compliance and mitigating risks in today's rapidly evolving privacy landscape. However, traditional manual approaches often struggle to keep pace with the growing volume and complexity of data. Join us for an insightful webinar where industry leaders from TrustArc and Privya will share their expertise on leveraging AI-powered solutions to revolutionize data discovery. You'll learn how to: - Effortlessly maintain a comprehensive, up-to-date data inventory - Harness code scanning insights to gain complete visibility into data flows leveraging the advantages of code scanning over DB scanning - Simplify compliance by leveraging Privya's integration with TrustArc - Implement proven strategies to mitigate third-party risks Our panel of experts will discuss real-world case studies and share practical strategies for overcoming common data discovery challenges. They'll also explore the latest trends and innovations in AI-driven data management, and how these technologies can help organizations stay ahead of the curve in an ever-changing privacy landscape.

TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery

TrustArc

MINDCTI Revenue Release Quarter One 2024

MIND CTI

presentation ICT roal in 21st century education

jfdjdjcjdnsjd

A Domino Admins Adventures (Engage 2024)

Gabriella Davis

Discord is a free app offering voice, video, and text chat functionalities, primarily catering to the gaming community. It serves as a hub for users to create and join servers tailored to their interests. Discord’s ecosystem comprises servers, each functioning as a distinct online community with its own channels dedicated to specific topics or activities. Users can engage in text-based discussions, voice calls, or video chats within these channels. Understanding Discord Servers Discord servers are virtual spaces where users congregate to interact, share content, and build communities. Servers may revolve around gaming, hobbies, interests, or fandoms, providing a platform for like-minded individuals to connect. Communication Features Discord offers a range of communication tools, including text channels for messaging, voice channels for real-time audio conversations, and video channels for face-to-face interactions. These features facilitate seamless communication and collaboration. What Does NSFW Mean? The acronym NSFW stands for “Not Safe For Work,” indicating content that may be inappropriate for professional or public settings. NSFW Content NSFW content encompasses material that is sexually explicit, violent, or otherwise graphic in nature. It often includes nudity, profanity, or depictions of sensitive topics.

Understanding Discord NSFW Servers A Guide for Responsible Users.pdf

UK Journal

Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving

Edi Saputra

Boost Fertility New Invention Ups Success Rates.pdf

sudhanshuwaghmare1

Automating Google Workspace (GWS) & more with Apps Script

wesley chun

Scaling API-first – The story of a global engineering organization

Radu Cotescu

Recently uploaded (20)

The 7 Things I Know About Cyber Security After 25 Years | April 2024

+971581248768>> SAFE AND ORIGINAL ABORTION PILLS FOR SALE IN DUBAI AND ABUDHA...

HTML Injection Attacks: Impact and Mitigation Strategies

Artificial Intelligence: Facts and Myths

Strategies for Landing an Oracle DBA Job as a Fresher

Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...

Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...

A Year of the Servo Reboot: Where Are We Now?

Real Time Object Detection Using Open CV

ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke

Boost PC performance: How more available memory can improve productivity

TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery

MINDCTI Revenue Release Quarter One 2024

presentation ICT roal in 21st century education

A Domino Admins Adventures (Engage 2024)

Understanding Discord NSFW Servers A Guide for Responsible Users.pdf

Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving

Boost Fertility New Invention Ups Success Rates.pdf

Automating Google Workspace (GWS) & more with Apps Script

Scaling API-first – The story of a global engineering organization

BrowserID review of mobile experience

1. Heuristics review of mobile experience of BrowserID Jason Grlicky and Crystal Beasley 02.10.2012

2. little things matter

3. copy matters use terms free of jargon

4. every little click matters

5. Case Study from Jared Spool [checkout] login or register payment info success

6. Case Study from Jared Spool [checkout] login or register payment info success

7. How many users did the log-in form cost? Some rights reserved by striatic

9. 75% bailed

10. [checkout] login or register payment info success

11. [checkout] payment info success

12. [checkout] payment info success

13. Increase sales by $300,000

14. Increase sales by $300,000,000

15. Login friction is costly.

16. Our solution has to be easier than it is.

17. be easier than it is.

18. be easier than legacy login.

19. be easier than other single sign-ons.

20. Create a new account iOS experience

21. Requesting Party

22. clicked [sign in] • Light branding of BrowserID is working well. • RP and “Sign in using” are so close to the same size, it’s hard to see which is more important. Remove "sign in using." • Show logo of RP to assure user they haven’t mis-clicked and they aren’t being phished.

23. clicked [next] • superﬂuous page • Page should not be scrolled down. • Footer is missing.

24. clicked [verify email] • Left-align for greater legibility. • Make 1st and 2nd lines more prominent. • Shorten and simplify the copy.

25. switch to Mail.app • Get RP name to use in subject line and in body. • The linkiﬁed URLs are preventing the user from immediately ﬁnding the correct link to click.

26. click URL • Email address is too low contrast. • Remove underline from button. • Footer is strangely aligned.

27. clicked [ﬁnish] • Close keyboard so the page content can be seen.

28. closed keyboard • Remove top nav to prevent users from failing to complete the registration with the RP. • Redirect user to RP. • The ideal ﬂow would make this page superﬂuous.

29. closed window • User was logged in already. • Seems to only work half of the time?

30. iOS add second email to existing BID proﬁle

31. clicked [sign in] • Horizontal space problems. • Text wrap is badly handled. • [This is not me] and [Use a different email] do not adequately convey their meaning and usage.

32. clicked [Use a diff email] • Users won’t know they have a proﬁle and the language inconsistency doesn’t help them build a correct mental model of our system.

33. clicked [add] • [use another email address] is inheriting the wrong css. Look different across browsers. • Support the back button for the case of user typing the wrong email address.

34. navigated to mail

35. clicked [url] • Header padding • Remove navigation • Incomplete copy • Redirect to RP.

36. iOS tablet

37. poor use of space make css more ﬂexible

38. Overall ﬁndings

39. General • Android and iOS rendered the pages similarly. Screenshots here are from iOS devices because it’s maddeningly difﬁcult to do them on Android. • Enable back button. • Add spinner on submit actions to communicate system state. • Avoid technical jargon like “Communicating with server.”

40. Legibility • Body fonts +1px in size • More contrast between font and background • Make links in text look more actionable • Buttons • More contrast between primary button colors and hover states • Increase kerning of button text • Increase size of button text

41. New API needs • Name of the RP • Logo of the RP (approx 100x150px) • Event hook to log the user into the RP automatically

42. Flow • The current interaction breaks the pattern of asking for email and password, then verifying the email. • Shorten the ﬂow.

43. [sign in] enter email [next] [verify email] conﬁrmation open email [URL] type password [ﬁnish] close window success

44. [sign in] enter email [next] [verify email] conﬁrmation open email [URL] type password [ﬁnish] close window success

45. [sign in] enter email [next] conﬁrmation open email [URL] type password success

46. [sign in] enter email [next] conﬁrmation open email [URL] type password success

47. [sign in] enter email [next] type password conﬁrmation open email [URL] success

48. [sign in] enter email [sign in] [next] enter email [verify email] [next] confirmation type password open email vs. confirmation [URL] open email type password [URL] [finish] success close window success

49. every little click matters

BrowserID review of mobile experience

Recommended

Recommended

More Related Content

Similar to BrowserID review of mobile experience

Similar to BrowserID review of mobile experience (20)

Recently uploaded

Recently uploaded (20)

BrowserID review of mobile experience

Editor's Notes