Compared with the traditional UI design, Apple Vision pro adds space attributes. In order to help users adapt to the new platform, Apple has built a set of familiar design language, which is consistent with existing platforms such as iOS. At the same time, some elements are aimed at Space platforms have been optimized.
1. Icon design
The icons in Apple Vision pro still continue the design style in IOS, and users can get started very quickly. At the same time, Vision OS icons have also been optimized accordingly.
- The shape of the icon has changed from a rounded rectangle to a circle
The biggest reason for this change is to make the gaze point more accurate, make the spacing between icons more clear, and the space more breathable.
- Added three-dimensional effect
The icon of Apple Vision pro is three-dimensional, the raised surface can be seen from the side, and it can dynamically interact with the gaze point. When you stare at a logo, the logo will expand and show highlights and shadows to deepen the subtle visual level .
2. Background design
Apple Vision Pro uses a frosted glass effect, which is a commonly used glass mimicry in design. This glass mimicry style runs through all Apple series, and even Apple's offline stores are also glass houses.
However, compared to other glass mimics, the glass mimicry in Apple Vision pro has been optimized to increase the sense of space of the glass mimicry. The icons and pages in Apple Vision pro are not directly stacked on the background, but fixed in blocks In the glass mimicry of the frosted glass texture. This kind of background design will make the page lighter and improve the sense of space, so that users can have a good environmental perception and visual experience in different environments.
3. Typesetting
In order to improve the legibility and recognition of the text, the default font in Apple Vision pro adopts the method of bolding, adding weight, and increasing the text spacing to ensure the recognition of the text to the greatest extent. At the same time, considering that the background uses glass mimicry, the color of the document box will change with the background content. Apple Vision pro uses a dynamic effect. Under different background environments, the brightness of the text will change dynamically. By adjusting the brightness of the text in real time, it can ensure that the text is clear easy to read.
4. Color design
In terms of color design, Apple Vision pro defaults to white. Under the background of glass mimicry, the white UI will reveal the color of the background, thus turning gray. Apple Vision pro is calibrated for the legibility of white text, and can dynamically adapt to the background window color tone and contrast.
At the same time, Apple Vision Pro has also launched other color schemes, most of which have relatively high saturation. Of course, some colors have also been calibrated, and the saturation is slightly lower. The richness of colors is to ensure that there are suitable colors to choose in each scene, because it is a system-level color, and it needs to ensure sufficient versatility.
In addition to the above design principles, Apple Vision Pro has also made breakthroughs in interaction design, visual design and space perception design. For example: gesture and eye positioning, control of field of view, interaction between head-mounted display content and reality, optimization of anti-vertigo during motion, etc.
In short, Apple's developers gave us a good interpretation of the design logic of Apple Vision pro , so that we can see Apple's thinking in the field of VR. I believe that many friends can't wait to experience and learn Apple Vision pro , but the official sale has not yet been officially launched, but the editor provides you with another learning path.
Copy Apple Vision pro templates online for free
Apple Vision pro has thought about UI design specifications and principles, and made adjustments according to the characteristics of the head-mounted display device to make the design principles more universal. Excellent design must have its design reasons and significance. We need to understand the appearance of Apple Vision pro design, but also the rules of Apple Vision pro design. If you want to understand Apple Vision pro, you must first start by learning Vision OS. To this end, the Pixso resource library has prepared a wealth of Apple Vision pro design source files for you, including :
Apple Vision pro icon collection
music system interface
Vision Pro UI Kit
These Apple Vision pro source files are free to use. Users only need to log in to the Pixso resource community, search for Vision OS, and click [Copy] on the page to open the source files for learning, or private message l1m0_.
