UX Feature Analysis
This article is a UX design feature analysis of streaks through Books, Duolingo, and Fizz. With the keen inclusion of UXD terms and an eye for the apps’ minutiae, this writing sample highlights my detail-orientedness and how I have been able to integrate my identity into my work. Reading on Apple’s Books app, posting jokes on Fizz, and avoiding my Duolingo reminders have been a part of my everyday life for as long as I have had access to a mobile phone.
Introduction
In a digital world of quick updates and frequently released competitors, ensuring that users return to an application is a significant focus for a company. Without tangible rewards to give users, creators must find a way to maintain user loyalty and bring straying consumers back to their applications. One way this has made its way into User Experience Design (UXD) is through integrated streak counters, employed to give users gratification and keep them accountable. Applications use streaks to “[add] a higher-level goal (keeping the streak alive) to a lower-level goal (completing an individual activity)” (Weathers, 2024, para. 18). However, a delve into multiple applications’ integration of this feature reveals inconsistencies across platforms, affecting user experience.
Overview
This review will focus on three applications: Books, Duolingo, and Fizz. Books is Apple’s in-house reading app, providing users with a space to buy books, read, and view files. Duolingo is a popular language-learning app, well-known for its burgeoning social media presence and green owl mascot. Fizz is a private forum application that provides anonymity to its users for campus-specific conversations. Each of these apps has wholly independent purposes and priorities. However, they share the presence of a streak counter to track consistent app usage and encourage prolonged practice.
This feature aims to reel individuals into the app and ensure a consistent user population. If users feel pressure from their streak to return to the app, the company has given its users a stake in a game that is based on the application’s own continued success. Similarly, “consumers consider maintaining a logged streak to be a meaningful goal in and of itself,” dedicating themselves to continued success because their behavior has established a repetitive habit (Silverman & Barasch, 2022, p. 1095). On the plus side, users feel accomplished from maintaining or saving their track record on the app: gratification that pushes them to return and read, learn, and chat. All the while, companies “benefit from highlighting consumers’ streaks in various consequential domains…without incurring a cost” (Silverman & Barasch, 2022, p. 1095).
Design Analysis: Apple’s Books App
The Books app is one of Apple’s automatically installed apps in the iOS ecosystem. The app's overall color scheme is black and white with gray accents. Thus, the electric blue of its streak counter stands out, even amid the in-house bookstore and readers’ covers.
Using the color scheme, the curved progress bar over the top of “Today’s Reading” gives readers a visual guide to measure how close they are to accomplishing their goal. This aligns with the Five Dimensions of Usability in its adherence to efficiency and a user’s state of mind. Adding a progress bar to a page enables users to view “the conditions of their current environment” and confirm their work status (D. Sackey, personal communication, January 31, 2024).
The app's colors continue to mark the days that users read during the week. As seen at the bottom of the image, days without user activity are filled in gray, while completed days are highlighted in blue. This sense of visual continuity rewards users with color to indicate accomplishment and stand out amid Books' otherwise black, white, and gray design. Apple carries this pattern through to the central check mark on its streak counter, using a common symbol to indicate accomplishment.
Moving away from the more visual-centered elements, a look at the streak counter’s microcopy/typeface reveals more. The fonts are, similar to the color scheme, a callback to the entirety of the app. The longer phrases, such as “Read every day, see your stats soar, and finish more books” (58 characters), are in a lighter font color compared to direct microcopy like “Keep Reading,” which has 12 characters. Thus, the chosen typeface gives more visual weight to pithy, direct statements.
Another element of design, using small, grayed out “>” icons, has a subtle but effective indication of the feature’s affordances. Using the symbol segues into the Gestalt Principle of Figure/Ground once the user presses on “Adjust Goal” and “Start a new streak.” The pop-up window that appears above the now muted background “provides context that helps keep people organized regarding their place in the interaction” while placing focus on the affordance at hand: a set wheel of choices (Johnson, 2020, pp. 24-26).
Design Analysis: Duolingo
Duolingo, a language learning app, is a popular staple for many polyglots’ journeys. The app has garnered fans across social media with much of its fame rooted in notifications for users to continue their streak.
The app generally relies on primary colors throughout its design, using a tetradic color scheme: “four colors that form two sets of complementary pairs with one color dominating” (D. Sackey, personal communication, February 11, 2024). However, the streak display uses complementary, or opposite colors on the color wheel, to create a display with clear contrast (D. Sackey, personal communication, February 11, 2024).
In the image to the right, the screenshot shows the screen that appears after a user finishes their lesson for the day: a preview of the fully fleshed-out streak counter shown in the left-justified image. This preview reflects a design feature discussed in Jeff Johnson’s Designing with the Mind in Mind that guides designers to “use color redundantly with other cues” (2020, pg. 54). Once a user completes one day in their streak, their progress is marked with both color and common metaphor; the previously gray circle is filled in with yellow, and a checkmark is situated in the middle.
Design Analysis: Fizz
Fizz, a private forum app that connects to students’ emails to give them access to a school-exclusive space, lacks a separate streak page. Rather, users are given an award after posting for ten days in a row, along with the respective awards for successive and increasing intervals of time. Thus, the streak counter is not a clear affordance nor an active presence in Fizz’s interface.
The award, marked by a notification (if users have notifications enabled) and a badge on the user’s award profile, is otherwise hidden from view.Unlike other unearned badges for “the most popular post of the day” or “the first time a user posts a gif,” awards for streaks are a secret feature given to dedicated users who may not even be chasing consistency. Rather, Fizz gives “Like Clockwork” and similar distinctions to users who happen to come across the progress counter or those who have set personal goals to remain steady in their app use.
The award's design mirrors Fizz’s general badge designs, using bright and contrasting colors with art to create gem-like shapes. Each award is paired with a title and descriptive microcopy that matches the app’s comedic angle. Otherwise, the only other text on the award is a chronological label that tells users when they earned the award, giving them general awareness of their app usage.
Usability Assessment: Apple’s Books
When looking at Book’s usability, the app has its strengths and weaknesses. In the overall layout of the application, the streak counter is placed at the near bottom of the home/”read now” page; a user needs to scroll past fourteen subsections to reach “Reading Goals.” This may be counterintuitive to the overall mapping of the application, made for users to buy and read their books. If a user is opening Books for the purpose of cracking open a novel, they may immediately jump to their “Library” from the home page, skipping over the long scroll to see where the streak counter is placed in the interface’s hierarchy and affecting its ease of use.
However, once a user has navigated to the streak counter, Apple has ensured clear learnability features in its design. As mentioned in the Design Analysis, Apple relies on the metaphor of check marks and arrow symbols, “hook[ing] users into existing mental models” (D. Sackey, personal communication, January 31, 2024). By using familiar imagery, Books gives its users satisfaction in marking off their reading goals and clues individuals into its affordances.
This brings the conversation to Apple’s integration of error prevention in the streak counter’s design. As seen to the left, the app integrates data-specific controls into its designs, “combin[ing] text fields and other controls to create hybrid controls for getting values of specific types from users” (Johnson, 2020, p. 39). The design choice enables users to quickly scroll to their adjusted goal while doubly eliminating mistyped information or a value the app is not able to process.
Usability Assessment: Duolingo
Navigating to Duolingo’s streak screen may be a struggle for users. To open the screen, users on the home screen must tap on a flame symbol at the top bar. However, there is no explicit identifier or microcopy of the streak affordance on the home screen or any other available pages. which may affect the streak counter’s ability to influence user behavior.
Across the app’s general design, Duolingo maintains one typeface across all its microcopy and writing, creating a consistent user experience throughout the app. One small change the designers made to elicit a clearer visual hierarchy amid a fully integrated font is to use capitalization. On the pages’ buttons, the app capitalizes the full text, emphasizing the actions and information assigned to the affordances. This relates to the Five Dimensions of usability in ensuring consistency, or the “principle of least surprise” (D. Sackey, personal communication, January 31, 2024). Users can familiarize themselves with the app and navigate through its varied pages without being offset by an aesthetic or system change, ensuring a smooth user experience.
While measuring user satisfaction, I reached out to Lillian Hurter, a frequent user of Duolingo for her Mandarin studies. She was instructed to open the application, navigate to the streak counter, and send her streak to a friend. As she completed the steps, she shared feelings of frustration when “[she could not] remember where the streaks were” (L. Hurter, personal communication, March 20, 2024). Realizing that Duolingo linked the feature to the flame symbol on its home screen led her to quickly find the sequence. However, her user satisfaction was affected by her initial frustration, which led to a lapse: “a failure of memory” (D. Sackey, personal communication, January 31, 2024).
Usability Assessment: Fizz
With Fizz’s unorthodox place amongst the other two apps and their interface designs, approaching its usability requires a different angle. As mentioned in the feature’s Design analysis, Fizz’s streak counter defies the general Five Dimensions of Usability: learnability, efficiency, visibility, errors, and satisfaction (D. Sackey, personal communication, January 31, 2024). Users are not able to easily navigate to it because it is not a visible feature until they have earned the award. After earning the badge, however, the deluge of colorful icons and microcopy does not aid users in recognizing their streak award among the others.
However, Fizz does integrate a familiar metaphor in alignment with ideas of learnability. The calendar icon denotes the feature’s relation to time/days. Therefore, even though Fizz strays from typical streak counters, elements of User Experience (UX) Design remain a part of its visibility.
Comparability
The three applications share similarities in their respective approaches to a streak counter. Clear, short microcopy and consistent typefaces maintain consistency across their interfaces. They all integrate metaphors, whether check marks or “x” symbols, to communicate information and affordances to their users. However, they retain differences amid their shared purpose.
Navigating to a user’s streaks varies from a long scroll to a hidden page to a buried award. Apple’s Books app adds a progress bar, and Duolingo provides users with a simplified streak view—separate from the dedicated page. Nevertheless, Fizz’s streak counter is the stark outlier. Rather than having a dedicated page for the streak counter and progress, the app integrates the feature as a hidden award—an “easter egg.” Even after unlocking its presence, the users are not able to see a tracker or visual representation of their use; they must rely on a general award and the date it was given to keep track.
Conclusion
Among the Design Analyses and Usability Assessments of the applications’ respective streak counters, there are strengths and weaknesses that could be combined to create a feature best honed for users’ experiences. As shared by all three apps, the feature’s location amid the overall app was lacking. By making the streak counter present when a user opens that app or creating a button, with clear labeling, in a central location that can be accessed without scrolling down on a user’s screen, the streak counter can more effectively hold users accountable by giving them easier access to their progress.
Regarding Fizz and its unique situation, the app and its comedic intention may be the motivation behind its lacking streak counter. However, displaying the user’s consistent posting or app use rather than denigrating a streak to an “easter-egg” award has the potential to create a more loyal and frequent group of users.
However, among their common strengths, the apps’ designs highlight the value of color and consistency across their interfaces. The common thread created by fonts and accent colors reminds users that they remain in the app’s space but have navigated to a new affordance, creating a comfortable sense of consistency throughout the user experience. While not only an aesthetic choice, the cohesion lends itself to increased learnability. Thus, user experience and satisfaction culminate with data-specific controls, metaphors, and clear affordances to define these gratifying, rewarding applications.
References
Books. (2024). Books’ Reading Goal Options [Screenshot].
Books. (2024). Books’ Streaks Display [Screenshot].
Duolingo. (2024). Duolingo Home Page [Screenshot].
Duolingo. (2024). Duolingo Streak Page [Screenshot].
Duolingo. (2024). Duolingo Streak Preview [Screenshot].
Fizz. (2024). Fizz Streak Award [Screenshot].
Fizz. (2024). Fizz Award Gallery [Screenshot].
Johnson, J. (2021). Designing with the Mind in Mind (Third Edition). Morgan Kaufmann. https://doi.org/10.1016/B978-0-12-818202-4.00003-9
Silverman, J., & Barasch, A. (2023). On or Off Track: How (Broken) Streaks Affect Consumer Decisions. The Journal of Consumer Research, 49(6), 1095–1117. https://doi.org/10.1093/jcr/ucac029
Weathers, D. (2024, January 3). The Duolingo effect: How keeping the “streak” is changing people’s behavior. Fast Company. https://www.fastcompany.com/91004057/the-duolingo-effect-how-keeping-the-streak-is-changing-the-way-people-behave