<> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image12.png) ### Introduction - **Project Title**: VisionOS DX - **Role**: Product Design Lead - **Teams**: Apple Services (Provider Design, App Store Engineering), Apple TDG - **Date**: 2021-2022 ### Problem In anticipation for visionOS platform announce and release—without completed hardware prototypes and an OS still under development—developers needed an intuitive distribution and testing experience for visionOS apps. ### Project Outcomes We successfully launched an industry standard setting hardware and software experience through the world's most advanced spatial computing platform. Setting the stage for generations of devices and experiences to come. ### Project Background During the height of the COVID pandemic while working remotely, I was asked to lead the developer experience initiative for a new hardware platform--now known as Vision Pro. During this time the group of employees working on the software was still small. Platform HI (a platform design team in a different org) was still exploring different patterns and approaches--down to colors, borders, and interactions. Our organization Apple Services (App Store, Apple Music, Apple TV, etc), had a special focus due to the planned content consumption importance of the platform. Each product within services had a designer working on their implementation in visionOS. We would iterate with those approved to work on the project and reconvene regularly to share feedback on patterns, styles, and approaches. This feedback would be incorporated at the platform level as well. For the majority of the time we did this without working prototype hardware, or even a complete understanding of the physical buttons on the device or what they did. In early design reviews, we used flat designs in Keynote presentations, we later were able to prototype on a gaming PC with Unity, and eventually with swiftUI on various iterations of the hardware. From a strategic level, we were concerned about how to release the product with the greatest impact knowing the majority of developers would not have access to hardware immediately after announce. It eventually became clear that we would have to support existing iOS apps, have an intuitive developer testing process, as well as a familiar onboarding process for new apps. ### Developer Touchpoint's 1. Testing visionOS apps before distribution 2. Preparing visionOS apps for distribution 3. Distributing iOS apps on visionOS ### Limitations 1. Limited OS design patterns 2. No prototype hardware 3. Executive audience who have not ### Ideation + Process ## Testing visionOS apps before distribution At Apple we typically have a discussion at project kick-off, possibly white-boarding exercises, and then dive directly into high fidelity designs—skipping wire-framing. Requirements are often refined and documented as a result of design iterations. There can be an upwards of 20 design reviews for projects to audiences of all sizes and seniority—from a few peers to over a 100. Designers at this stage are expected to defend all design decisions and put forward the best user experience possible. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image11.png) For this project, I re-familiarize myself with the testing patterns used in our other platforms. For example the Welcome Modal. Users expect an intuitive and relatable experience when interacting with Apple products. So from the very first screen that they see when interacting with TestFlight for Vision Pro is a welcome screen directly influenced by MacOS and iOS versions. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image.png) ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image2.png) This screen was the first to be explored as it was a simple view to start to implement patterns that were still evolving at a platform HI level. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image3.png) Alt 1 <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image4.png) Alt 2 - Illustrative Icons ## Preparing visionOS apps for distribution For distribution, by adding yet another platform, the aging patterns used in App Store Connect faced issues with scalability. These limitations manifested in a number of areas, including individual app lockups, app creation screens, and the app index. Various solutions were considered including some thought given to updating the version and platform construct—this ranged from keeping the relationship as-is all of the way to separating apps from platforms and versions—apps would be managed on a commit model with platforms, meta data, and all other app data as attributes. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image5.png) Due to engineering constraints we were unable to affect paradigmatic change to the app - version - platform construct. However, we were able to improve the DX by making aesthetic and usability updates to App Store Connect. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image6.png) Improvements include increasing the height and width of individual app icons—creating additional space that allowed the inclusion of an additional platform in the app lockup. This was a temporary solution that would be rethought but and queued for further improvements. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image8.png) <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image7.png) Horizontal space was not an issue and easily allowed the addition of an additional platform. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image9.png) Subsequent platform creation was pulled from the tertiary navigation and consolidated to one action: "Add Platform" instead of enumerating every platform action e.g. "Add iOS." This improved some of the scaling pains in the menu itself. ## Distributing iOS apps on visionOS We ideated various approaches on how to maximize the number of apps we had on the platform at launch—an advantage Apple had at launch was our immense catalog of iOS apps. How we sliced that pie though, was up for extended debate and approaches. Apple's transition from x86 to M processors set a certain precedent with automatically opting in certain apps versus others in the new App Store. However, for this new platform we had different interaction inputs that drastically impacts the usability of various types of apps. Furthermore, technical differences (such as lack of GPS) in the platform also compounded the implementation of opting iOS apps in the new App Store. We knew for sure that some apps wouldn't work. We knew that some apps would work. The grey area was composed of apps that were potentially compatible. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image10.png) Starting with all iOS Apps, we decided on taking our Top Apps and automatically opting in working apps and manually testing the remainder. Apps outside of our top apps that were potentially compatible were opted out by default. Incompatible binaries that required SDKs or hardware features unavailable on the platform were also omitted. It's important to note that developers could opt out any iOS app from visionOS distribution. ### Final Flow <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image13.png) Testers can be invited via email or through a public link. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image14.png) A tester opens an invite to test Photoshop 3D. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image15.png) The invite modal invites a user to test along with a description of the app and terms of service. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image16.png) Conveying to leadership the interaction of gaze and pinch was uniquely challenging because at the time there was not a working OS or prototype hardware. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image17.png) The install screen was intended to reflect TestFlight on other platforms—without upstaging other Apple applications. We were required to provide care to not create an alternative app store but a testing platform. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image18.png) Install action. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image19.png) Install indicator. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image20.png) Visual indicator on gaze for beta apps. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image21.png) There was debate on whether to center the indicator and text or just center on text. There were platform level debates on this and the technical feasibility. Design's preference was to center the entire grouping, visually it felt better. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image22.png) Sending feedback starts within the app detail screen. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image23.png) Without Gaze <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image24.png) With Gaze <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image25.png) Voice dictation explores. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image26.png) Attaching a screenshot. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image27.png) Implementing the system photo picker. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image28.png) Rather than creating a new pattern or photo picking experience we leverages an easier to implement solution of filtering photos by screenshots. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image29.png) Selecting items. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image30.png) Items attached. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image31.png) Image Gaze. <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image32.png) Quicklook <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image33.png) Submit <> ![](https://portfolio-bb.s3.us-west-1.amazonaws.com/VisionOS-DX/image34.png) Captured items from users are reflected in App Store Connect under the TestFlight tab. ### Conclusion On a personal level, working on a new platform was incredibly exciting and rewarding. Being able to contribute design, consideration, and thought to cross functional conversations that had impact to the experience of a novel computing platform was possibly once in a lifetime. VisionOS and Vision Pro were released to great fanfare. With developers around the world developing apps for spatial computing and continue to push what is possible. I can't wait to see the marriage of spatial computing and other trending technologies—along with the evolution of the platform from a hardware perspective.

 VisionOS DX