Category

Product

Topics

User Experience, UX Research, Product Design

iOS Phone App Redesign

For users, the call management interface posed significant challenges with its existing design. I took the initiative to enhance this crucial element, prioritising usability and system efficiency. Through meticulous efforts, I introduced a novel system that significantly improves the user experience, ensuring clarity, intuitiveness, and enhanced multitasking capabilities.

For users, the call management interface posed significant challenges with its existing design. I took the initiative to enhance this crucial element, prioritising usability and system efficiency. Through meticulous efforts, I introduced a novel system that significantly improves the user experience, ensuring clarity, intuitiveness, and enhanced multitasking capabilities.

Problem

The existing design of the iOS waiting call window poses a set of design choices that result in an ambiguous communication of the actions available to the user. When a second call is received, the current interface moves to a full-screen modal window, presenting a rather unclear combination of icons and word descriptions for actions to handle both the ongoing and waiting calls, the "End & Accept" and "Hold & Accept" in particular. Below are the main pain points of this screen:

Observations

The phone call interface within Apple's iOS serves as a multimodal platform, enabling user interaction through voice and touch commands, extending its reach beyond the application itself to encompass various possible actions in different applications. 

Initially, my goal was to address the ambiguity of command clarity on the waiting call screen. However, the interface architecture revealed additional navigational frictions in different use scenarios.

Structurally, the phone call interface predominantly operates on full-screen modal windows, meaning that for each state variation, information is partitioned into new windows that provide either additional details or actions. While this approach is often valuable for tasks requiring higher focus or consideration, it disrupts context and spatial continuity, introducing a discontinuity between the information displayed before and after the transition. In the specific context of a call interface on a consumer-oriented device, the benefits of such a modality are not objectively clear and reveal considerable frictions in usability.

Therefore, I have hypothesised the possibility of creating a straightforward and familiar waiting call notification by reworking not only the hierarchy of the elements and visual affordances, but also by deconstructing the windowing paradigm, which retroactively benefited several instances of the app where the limitations of such design structure result in disjointed navigation, such as the primary call screen, when opening the number keypad, the contacts menu when adding participants, and in instances of simultaneous access to other apps during a call.

In this speculative design proposal, I explore alternative methods implementing animation and scaling as guiding cues to aid users in understanding information and action hierarchy, leveraging the familiar behaviours and patterns of touch screen interactions developed and collectively adopted over the years, as well as aligning the user interface with the Apple's Human Interface Guidelines, which were invaluable to the development of this proposal.

3

2

1

Action ambiguity

The wait call window's commands are unclear and confusing. Users face difficulties in making efficient decisions due to ambiguity, leading to unnecessary cognitive load and friction in the call-handling process.

Observations

While my initial motivation was to address the confusing communication of the waiting call screen, which could arguably be solved by changing the labels, the interface architecture posed additional interaction frictions on different use scenarios.

Structurally, the phone call interface predominantly operates on full-screen modal windows, that is, for each variant state there’s it’s respective full-screen layout, blocking the view and access to the previous state. While this approach is valuable for tasks demanding high levels of focus, in the context of a voice or video call that advantage doesn’t seem to be objectively clear. The predominance of this navigation pattern might disrupt context and spatial preservation while transitioning between in-app states such as previously described

in the case of the waiting call screen, but also in instances of simultaneous app usage, for instance, accessing Notes or Files during a call, resulting in a disjointed navigation flow. Additionally, several visual elements and gestural interactions users are familiar with and perform intuitively from memory could be integrated.

In light of these challenges, I designed a speculative proposal for the iOS phone call interface in an effort to optimise the overall user experience, keeping in mind the principle of familiarity as a fundamental guiding boundary to which Apple's Human Interface Guidelines were invaluable.



3

2

1

Vision

Multimodal dynamics. The gains in screen white space allow for multiple actions across different apps during a call.

Vision

Multimodal dynamics. The gains in screen white space allow for multiple actions across different apps during a call.

The semantic and graphic ambiguity were approached through an impactful binary choice system was crafted for incoming waiting calls. To expedite and simplify decision-making during incoming waiting calls, a binary system was devised to provide users with immediate response options using a green and red scheme for the two primary action buttons to either accept or decline the call.

The semantic and graphic ambiguity were approached through an impactful binary choice system was crafted for incoming waiting calls. To expedite and simplify decision-making during incoming waiting calls, a binary system was devised to provide users with immediate response options using a green and red scheme for the two primary action buttons to either accept or decline the call.

Waiting call - simplify interaction.

In adherence to non-full-screen modal design principles, the waiting call interface has been reimagined as a discrete, floating card positioned at the bottom of the screen. This approach minimises disruption to the user's current call, enabling them to maintain focus on their primary task while still having call control functionalities available. This arrangement eliminates the need for unwieldy full-screen modes, facilitating users to swiftly manage calls and navigate through simultaneous interaction with other applications or content on the screen seamlessly.

The restructured floating call card efficiently integrates all primary actions, including options for muting, accessing the number keyboard, enabling the speaker, adding participants, and secondary actions accessible through the ellipsis. When the user is prompted to choose from a list of options, contextual menus replace standalone screen-states to avoid moving the user in the digital space, preserving spatial continuity and uninterrupted access to prior commands.

The restructured floating call card efficiently integrates all primary actions, including options for muting, accessing the number keyboard, enabling the speaker, adding participants, and secondary actions accessible through the ellipsis. When the user is prompted to choose from a list of options, contextual menus replace standalone screen-states to avoid moving the user in the digital space, preserving spatial continuity and uninterrupted access to prior commands.

Card dynamics

The gains in screen white space allow for multiple actions across different apps during a call, whether navigating to a different app or accessing a widget from the lock screen, which is a common default state when receiving calls.

The floating card pattern offers numerous opportunities to arrange information dynamically. This design allows cards to be moved, resized, and closed, leveraging their familiar nature to Apple users across its diverse operating systems. This flexibility ensures that elements can be reused across multiple interfaces, including the spatial environment of Vision OS. By maintaining consistency and familiarity, the floating card design enhances user experience and interaction efficiency across the Apple ecosystem.

The floating card pattern offers numerous opportunities to arrange information dynamically. This design allows cards to be moved, resized, and closed, leveraging their familiar nature to Apple users across its diverse operating systems. This flexibility ensures that elements can be reused across multiple interfaces, including the spatial environment of Vision OS. By maintaining consistency and familiarity, the floating card design enhances user experience and interaction efficiency across the Apple ecosystem.

A familiar and reusable element

The gains in screen white space allow for multiple actions across different apps during a call, whether navigating to a different app or accessing a widget from the lock screen, which is a common default state when receiving calls.

Summary

The existing design of the iOS waiting call window poses a set of design choices that result in an ambiguous communication of the actions available to the user. When a second call is received, the current interface moves to a full-screen modal window, presenting a rather unclear combination of icons and word descriptions for actions to handle both the ongoing and waiting calls, the "End & Accept" and "Hold & Accept" in particular. Below are the main pain points of this screen:

Summary

This work showcases a comprehensive effort to optimize navigation patterns within the iOS call app interface by methodically deconstructing the existing structure. This process prioritized integrating familiar iOS elements, such as the incoming call banner and Facetime dashboard, to enhance user familiarity. Notably, particular attention was allocated to crafting a cohesive design for the waiting call card and primary call banner, ensuring their smooth functionality within the unified interface. A deliberate avoidance of modal designs preserved the integrated feel of the app without introducing standalone app-like interruptions.

The design process ingeniously tackled each screen state concurrently, resulting in a cohesive and synchronized interface. This approach produced an interactive flow that is both intuitive and familiar, facilitating seamless task transitions for users at every stage. Ultimately, the refined design framework significantly improves user orientation within the app, fostering efficient and uninterrupted call engagement while accommodating diverse task requirements.

©2024 André Duarte

©2024 André Duarte