Apple HMI Guide Documentation Read the SUMMARY

For the official document designing for IOS translation, please correct me.
Official Document Address
Themes that IOS embodies

• Deference (submissive, respectful) UI helps us to understand content and interact with content, but does not affect the presentation of content
• Clarity (Clear) The text is easy to recognize, regardless of the size, and the avatar is easily distinguishable; the small parts of the decoration are also very delicate and suitable; the purpose of the design is to focus on its function.
• Depth (depth) visual level and the use of reality to give vitality, increase people's happiness and understanding
  

Whether you are re-designing an old app or re-doing a new one, consider doing the work in the following ways

• First, look at the core features of the past UI and confirm the association between them.
• Second, use the iOS theme to confirm the theme of the UI and their purpose. Think carefully to add some details and decorations.
• Finally, make sure that your UI is adaptable to all devices, because users may use them in many environments.

Through these, prepare for the challenge of the design before, make assumptions, focus on the content and function of factors such as decision-making

Defer to Content

while a fresh, beautiful UI and smooth gestures are the highlight of iOS apps, User content is his core
Here are some ways to make sure your design improves functionality and does not affect the presentation of your content

Take advantage of the whole screens

The weather is a good example: a beautiful, full-screen way to describe the location of the current weather information covers a lot of important information, in a partitioned way to show the data of each hour

Reconsider visual indicators of physicaltiy and realism

ramps, gradients, and shadows sometimes lead to heavier UI elements, and they obscure the display of content. However, focusing on content to guide the UI to play an important supporting role is the most important

Let translucent (transparent) UI elements hint at the content behind them

transparent elements, such as control centers, provide the environment to help users see more of what is available, and can emit a brief signal. In iOS, transparent elements only blur the content behind it-giving people a feeling that they can see things through paper-not blurred elsewhere on the screen

Provide Clarity (Clear)

A clear presentation is another way to ensure that content is the ultimate element in the app, and there are ways to make the most important content and functionality clear and simple to interact with the user

Use plenty of negative space

negative space can make important content and function more obvious and easy to understand. Negative space can also convey a sense of calm and tranquility, and he can make an application look more focused and efficient

Let color simplify the UI

a key color, such as the yellow in Notepad, highlights important state information and subtly illustrates the interaction. This also provides an always-on visual theme for applications. Built-in apps use solid colors that look good in any color, whether in dark or brighter backgrounds

Ensure legibility (readable) by using the system font

Francisco (an iOS system font) dynamically adjusts character spacing and line heights to be easy to read and look good in any size context. Whether using a San Francisco or a custom font, be sure to use the dynamic Type so that the application can respond when the user chooses a different text size

Embrace (hug) Borderless buttons

By default, all status bar buttons are borderless. In the content area, the borderless buttons use context, and colors and text indicate that they can be interacted with. When this button makes sense, a button in a content area can show a thin border and a colored background to make it different .

Use Depth to communicate

IOS often presents content in different tiers to communicate levels and positions, and helps users understand the relationship between screen objects

On devices that support 3DTouch, touch, Peek,pop, and quick actions allow users to access important functions without leaving the context

by using semi-transparent backgrounds and seemingly floating folders on the live screen, this content is separated from other screens on the screen

The hint item shows Ali as a layer, as shown below. When a user uses a list, the other list shrinks to the bottom of the screen

The calendar uses an enhanced transition to give the user a sense of level and depth of God when they swipe to view the year, month, and day. In the scroll year view shown below, users can immediately see today's date and can schedule tasks for other dates

when the user selects a month, the year's view is scaled to reveal the month view. Today's date will still be highlighted. The annual meeting is displayed at the return key. So the user will clearly know where they are, where they are coming in, and how to return

A similar shift occurs when the user chooses a day: The Month view splits, pushing the current week to the top of the screen, revealing the hour view of the day. In each transition, the calendar reinforces the hierarchical relationship of the year, month, and day

Apple HMI Guide Documentation Read the SUMMARY