Layout - Foundations - Human Interface Guidelines - Design (2023)

Using a consistent layout that adapts to various contexts makes your experience more approachable and helps people enjoy their favorite apps and games on all their devices.

Layout - Foundations - Human Interface Guidelines - Design (1)Layout - Foundations - Human Interface Guidelines - Design (2)

Guides and safe areas

A layout guide defines a rectangular region that helps you position, align, and space your content on the screen. The system includes predefined layout guides that make it easy to apply standard margins around content and restrict the width of text for optimal readability. You can also define custom layout guides.

A safe area defines the area within a view that isn’t covered by a navigation bar, tab bar, toolbar, or other views a window might provide. Safe areas are essential for avoiding a device’s display and interactive features, like a sensor housing or Home indicator.

In iOS, iPadOS, and tvOS, the system defines a collection of traits that characterize variations in the device environment that can affect the way your app displays on the screen. Using SwiftUI or Auto Layout, you can ensure that your interface adapts dynamically to a wide range of traits, including:

  • Different device screen sizes, resolutions, and color spaces
  • Different device orientations (portrait/landscape)
  • Split view
  • Multitasking modes on iPad
  • Dynamic Type text-size changes
  • Internationalization features the system can enable based on locale (left-to-right/right-to-left layout direction, date/time/number formatting, font variation, text length)
  • System feature availability

Best practices

Design a consistent layout that adapts gracefully to context changes, while displaying the same content as much as possible. People expect your experience to work well and remain familiar when they rotate their device, resize a window, or switch to a different device. Ensure an adaptable interface by respecting system-defined safe areas, margins, and guides and specifying layout modifiers to fine-tune the placement of views in your hierarchy.

Respect key display and system features in each platform. Safe areas help you accommodate features like the corner radius and sensor housings on various devices, and avoid interfering with interactive system elements like the Home indicator and app switcher on iPhone and iPad. Safe areas also help you account for interactive components like bars, dynamically repositioning content if sizes change.

Use placement to convey relative importance. In general, place principal items in the upper half of the screen or window, near the leading side. People typically start in this area, whether they’re looking at the screen or using a screen reader like VoiceOver.

Elevate essential information by giving it sufficient space. People want to view the most important information instantly, so you don’t want to clutter the screen or window with nonessential details. People can easily access secondary information by scrolling.

Create visual groupings to help people find the information they want. For example, you might use negative space, background shapes, colors, and materials, or separator lines to display related elements and information in distinct areas.

Use alignment to ease visual scanning and to communicate organization and hierarchy. Alignment makes an app look neat and organized, helps people focus while scrolling, and makes it easier to find information. Indentation and alignment can also help people visualize an information hierarchy.

Be mindful of aspect ratio. Different screen sizes may have different aspect ratios, causing artwork to appear cropped, letterboxed, or pillarboxed. When this is the case, don’t change the aspect ratio of the artwork; instead, scale it to fill the screen so that important visual content remains in view on all display sizes.

Be prepared for text-size changes. People expect most apps to respond when they choose a different text size. To accommodate text-size changes, you might need to adjust the layout. For guidance on displaying text in your app, see Typography.

When possible, consider alluding to hidden content by partially displaying offscreen elements. In large collections where content doesn’t fit on a single screen, you might be able to hint at the additional content by showing portions of the offscreen items.

On touch screens, provide ample touch targets for interactive components. Maintain a minimum tappable area of 44x44 points for all controls.

Preview your app on multiple devices, using different orientations, localizations, and text sizes. Although it’s generally best to preview features like wide color on actual devices, you can use Xcode Simulator to check for clipping and other layout issues. For example, if your iOS app supports landscape mode, you can use Simulator to make sure your layouts look great regardless of whether the device rotates left or right.

Platform considerations

iOS, iPadOS

Aim to support both portrait and landscape orientations. People choose different orientations for a variety of reasons, and they generally expect apps to work well in every context. If it’s essential that your app run in a single orientation, don’t tell people to rotate their device to match; if your app doesn’t rotate automatically when someone holds the device in an unsupported orientation, they’ll know instinctively to rotate it. If your app is landscape-only, make sure it runs equally well whether people rotate their device to the left or the right.

If your app runs on a specific device, make sure it runs on every screen size for that device. In other words, an iPhone-only app must run on every iPhone screen size and an iPad-only app must run on every iPad screen size. For guidance, see Device screen sizes and orientations.

Inset full-width buttons. Respect the standard system-defined margins on the sides of full-width buttons. A full-width button at the bottom of the screen generally looks best when it has rounded corners and it aligns with the bottom of the safe area — which also ensures that it doesn’t conflict with the Home indicator.

(Video) Breaking down the Apple Human Interface Guidelines (Apple's Human Interface Guidelines Overview)

Extend visual content to fill the screen. Make sure backgrounds extend to the edges of the display, and that vertically scrollable layouts, like tables and collections, continue all the way to the bottom.

On iPad, consider placing controls on the sides of the screen in landscape orientation. When controls are on the left and right sides of the screen, people can reach them easily with both hands while they’re holding the device.

Avoid placing interactive controls at the bottom edge of the screen when possible. Regardless of orientation, people use system gestures at the bottom edge of the display to access features like the Home screen and app switcher, and these gestures may cancel custom gestures you implement in this area. Also avoid placing controls in the far corners of the screen because these areas can be difficult for people to reach comfortably. If your game needs to place controls in the lower portion of the screen — below the safe area — use matching insets when placing them at the top and bottom of the screen, and leave ample space around the Home indicator so people don’t accidentally target it when trying to interact with a control.

Be prepared for different status bar heights. If you display content below the status bar, you can use the safe area to help dynamically reposition the content as needed.

Hide the status bar only when it adds value or enhances your experience. The status bar displays information people find useful and it occupies an area of the screen most apps don’t fully use, so it’s generally a good idea to keep it visible.

iOS, iPadOS safe areas

The safe area defines the area within a view that isn’t covered by a navigation bar, tab bar, toolbar, or other views a view controller might provide.

  • Layout - Foundations - Human Interface Guidelines - Design (3)

    Layout - Foundations - Human Interface Guidelines - Design (4)

  • Layout - Foundations - Human Interface Guidelines - Design (5)

    Layout - Foundations - Human Interface Guidelines - Design (6)

iOS keyboard layout guide

iOS 15 defines a keyboard layout guide that represents the space the keyboard currently occupies and accounts for safe area insets. Using this guide can help you make the keyboard feel like an integral part of your app, regardless of the type of keyboard people use or where they position it. For developer guidance, see UIKeyboardLayoutGuide.

Layout - Foundations - Human Interface Guidelines - Design (7)

When the keyboard is visible, the layout guide represents its area and position.

Layout - Foundations - Human Interface Guidelines - Design (8)

(Video) Apple's MOST USEFUL Design Resource is STUNNING!! (2022 Edition)

When the keyboard dismisses, the top of the layout guide matches the bottom of the safe area layout guide.

macOS

Avoid placing controls or critical information at the bottom of a window. People often move windows so that the bottom edge is below the bottom of the screen.

tvOS

TVs vary widely in size. On Apple TV, app layouts don’t automatically adapt to the size of the screen like they do on iPhone or iPad. Instead, apps show the same interface on every display. Take extra care in designing your layout so that it looks great in a variety of screen sizes.

Adhere to the screen’s safe zone. Inset primary content 60 pixels from the top and bottom of the screen, and 80 pixels from the sides. It can be difficult for people to see content that close to the edges, and unintended cropping can occur due to overscanning on older TVs. Allow only partially displayed offscreen content and elements that deliberately flow offscreen to appear outside this zone.

Layout - Foundations - Human Interface Guidelines - Design (9)

Include appropriate padding between focusable elements. When you use UIKit and the focus APIs, an element gets bigger when it comes into focus. Consider how elements look when they’re focused, and make sure they don’t unintentionally overlap important information.

Layout - Foundations - Human Interface Guidelines - Design (10)

Use layout templates to build media-centered apps and use grids to provide collections of content. If the layout of your media app simply needs to present content beautifully with minimal layout customization, use a predesigned layout template. If your app needs to showcase a collection of content, use a grid to make the content easy to browse at a distance and quick to navigate with the remote.

Layout templates

Apple TV templates deliver clean, consistent layouts that make content the center of attention. These templates — based on JavaScript and the Apple TV markup language (TVML) — dynamically load and populate with content when people open your app. Templates give you flexibility to create content-rich apps with predefined layouts that look good on the TV screen and are ideal for streaming media.

Choose a template based on its purpose. You can customize a template’s background, color, size, layout, and more, but if your customizations make the template jarring or unrecognizable, consider using a different one or designing a custom interface.

  • Layout - Foundations - Human Interface Guidelines - Design (11)

    Alert Template

    The alert template displays a message that asks for permission to perform an action, such as confirming a purchase or a destructive action like a deletion.

    See also Alerts.

  • Alert template
  • Catalog template
  • Compilation template
  • Descriptive alert template
  • Form template
  • List template
  • Loading template
  • Menu bar template
  • Parade template
  • Product template
  • Product bundle template
  • Rating template
  • Search template
  • Stack template

Customize templates tastefully. Layout templates are highly customizable; you have control over the background, tinting, size, layout, and more. As you design your app, defer to content whenever possible, avoiding customizations that appear distracting, jarring, or obtrusive.

Understand a template’s purpose before using it. If your customizations make the underlying template unrecognizable, consider using a different template or building a custom interface.

For detailed information about integrating templates into your app, see TVML.

(Video) Apple Human Interface Guidelines 2022 Part 01: Accessibility

Grids

The following grid layouts provide an optimal viewing experience. Be sure to use appropriate spacing between unfocused rows and columns to prevent overlap when an item is brought into focus.

If you use the UIKit collection view flow element, the number of columns in a grid is automatically determined based on the width and spacing of your content. For developer guidance, see UICollectionViewFlowLayout.

  • Layout - Foundations - Human Interface Guidelines - Design (12)

    Two-Column Grid

    Attribute Value
    Unfocused content width 860pt
    Horizontal spacing 40pt
    Minimum vertical spacing 100pt
  • Layout - Foundations - Human Interface Guidelines - Design (13)

    Three-Column Grid

    Attribute Value
    Unfocused content width 560pt
    Horizontal spacing 40pt
    Minimum vertical spacing 100pt

Include additional vertical spacing for titled rows. If a row has a title, provide enough spacing between the bottom of the previous unfocused row and the center of the title to avoid crowding. Also provide spacing between the bottom of the title and the top of the unfocused items in the row.

Use consistent spacing. When content isn’t consistently spaced, it no longer looks like a grid and it’s harder for people to scan.

Make partially hidden content look symmetrical. To help direct attention to the fully visible content, keep partially hidden offscreen content the same width on each side of the screen.

watchOS

Align text with the system-defined side margins. In Apple Watch Series 4 and later, watchOS defines a one-pixel boundary at the side edges of the screen. Although you need to align text with the minimum side layout margins so that it remains legible at a glance, you can make graphic elements and button backgrounds extend beyond the margins and up to this one-pixel boundary.

Design your content to extend from one edge of the screen to the other. The Apple Watch bezel provides a natural visual padding around your content. To avoid wasting valuable space, consider minimizing the padding between elements.

Layout - Foundations - Human Interface Guidelines - Design (16)

Avoid placing more than two or three controls side by side in your interface. As a general rule, display no more than three buttons that contain glyphs — or two buttons that contain text — in a row. Although it’s usually better to let text buttons span the full width of the screen, two side-by-side buttons with short text labels can also work well, as long as the screen doesn’t scroll.

Layout - Foundations - Human Interface Guidelines - Design (17)

Support autorotation in views people might want to show others. When people flip their wrist away, apps typically respond to the motion by sleeping the display, but in some cases it makes sense to autorotate the content. For example, a wearer might want to show an image to a friend or display a QR code to a reader. For developer guidance, see isAutorotating.

Specifications

iOS, iPadOS

Device screen sizes and orientations

Device Dimensions (portrait)
12.9" iPad Pro 1024x1366 pt (2048x2732 px @2x)
11" iPad Pro 834x1194 pt (1668x2388 px @2x)
10.5" iPad Pro 834x1194 pt (1668x2388 px @2x)
9.7" iPad Pro 768x1024 pt (1536x2048 px @2x)
7.9" iPad mini 768x1024 pt (1536x2048 px @2x)
10.5" iPad Air 834x1112 pt (1668x2224 px @2x)
9.7" iPad Air 768x1024 pt (1536x2048 px @2x)
10.2" iPad 810x1080 pt (1620x2160 px @2x)
9.7" iPad 768x1024 pt (1536x2048 px @2x)
iPhone 13 Pro Max 428x926 pt (1284x2778 px @3x)
iPhone 13 Pro 390x844 pt (1170x2532 px @3x)
iPhone 13 390x844 pt (1170x2532 px @3x)
iPhone 13 mini 375x812 pt (1125x2436 px @3x)
iPhone 12 Pro Max 428x926 pt (1284x2778 px @3x)
iPhone 12 Pro 390x844 pt (1170x2532 px @3x)
iPhone 12 390x844 pt (1170x2532 px @3x)
iPhone 12 mini 375x812 pt (1125x2436 px @3x)
iPhone 11 Pro Max 414x896 pt (1242x2688 px @3x)
iPhone 11 Pro 375x812 pt (1125x2436 px @3x)
iPhone 11 414x896 pt (828x1792 px @2x)
iPhone XS Max 414x896 pt (1242x2688 px @3x)
iPhone XS 375x812 pt (1125x2436 px @3x)
iPhone XR 414x896 pt (828x1792 px @2x)
iPhone X 375x812 pt (1125x2436 px @3x)
iPhone 8 Plus 414x736 pt (1080x1920 px @3x)
iPhone 8 375x667 pt (750x1334 px @2x)
iPhone 7 Plus 414x736 pt (1080x1920 px @3x)
iPhone 7 375x667 pt (750x1334 px @2x)
iPhone 6s Plus 414x736 pt (1080x1920 px @3x)
iPhone 6s 375x667 pt (750x1334 px @2x)
iPhone 6 Plus 414x736 pt (1080x1920 px @3x)
iPhone 6 375x667 pt (750x1334 px @2x)
4.7" iPhone SE 375x667 pt (750x1334 px @2x)
4" iPhone SE 320x568 pt (640x1136 px @2x)
iPod touch 5th generation and later 320x568 pt (640x1136 px @2x)

NOTE All scale factors in the table above are UIKit scale factors, which may differ from native scale factors. For developer guidance, see scale and nativeScale.

Device size classes

Different size class combinations apply to the full-screen experience on different devices, based on screen size.

Layout - Foundations - Human Interface Guidelines - Design (18)

Device Portrait orientation Landscape orientation
12.9" iPad Pro Regular width, regular height Regular width, regular height
11" iPad Pro Regular width, regular height Regular width, regular height
10.5" iPad Pro Regular width, regular height Regular width, regular height
9.7" iPad Regular width, regular height Regular width, regular height
7.9" iPad mini Regular width, regular height Regular width, regular height
iPhone 13 Pro Max Compact width, regular height Regular width, compact height
iPhone 13 Pro Compact width, regular height Compact width, compact height
iPhone 13 Compact width, regular height Compact width, compact height
iPhone 13 mini Compact width, regular height Compact width, compact height
iPhone 12 Pro Max Compact width, regular height Regular width, compact height
iPhone 12 Pro Compact width, regular height Compact width, compact height
iPhone 12 Compact width, regular height Compact width, compact height
iPhone 12 mini Compact width, regular height Compact width, compact height
iPhone 11 Pro Max Compact width, regular height Regular width, compact height
iPhone 11 Pro Compact width, regular height Compact width, compact height
iPhone 11 Compact width, regular height Regular width, compact height
iPhone XS Max Compact width, regular height Regular width, compact height
iPhone XS Compact width, regular height Compact width, compact height
iPhone XR Compact width, regular height Regular width, compact height
iPhone X Compact width, regular height Compact width, compact height
iPhone 8 Plus Compact width, regular height Regular width, compact height
iPhone 8 Compact width, regular height Compact width, compact height
iPhone 7 Plus Compact width, regular height Regular width, compact height
iPhone 7 Compact width, regular height Compact width, compact height
iPhone 6s Plus Compact width, regular height Regular width, compact height
iPhone 6s Compact width, regular height Compact width, compact height
iPhone SE Compact width, regular height Compact width, compact height
iPod touch 5th generation and later Compact width, regular height Compact width, compact height

On iPad, size classes also apply when your app or game runs in a multitasking configuration.

Device Mode Portrait orientation Landscape orientation
12.9" iPad Pro 2/3 split view Compact width, regular height Regular width, regular height
1/2 split view N/A Regular width, regular height
1/3 split view Compact width, regular height Compact width, regular height
11" iPad Pro 2/3 split view Compact width, regular height Regular width, regular height
1/2 split view N/A Compact width, regular height
1/3 split view Compact width, regular height Compact width, regular height
10.5" iPad Pro 2/3 split view Compact width, regular height Regular width, regular height
1/2 split view N/A Compact width, regular height
1/3 split view Compact width, regular height Compact width, regular height
9.7" iPad 2/3 split view Compact width, regular height Regular width, regular height
1/2 split view N/A Compact width, regular height
1/3 split view Compact width, regular height Compact width, regular height
7.9" iPad mini 4 2/3 split view Compact width, regular height Regular width, regular height
1/2 split view N/A Compact width, regular height
1/3 split view Compact width, regular height Compact width, regular height

watchOS

Series Screen size Width (pixels) Height (pixels)
7 and later 41 mm 352 430
7 and later 45 mm 396 484
4, 5, and 6 40 mm 324 394
4, 5, and 6 44 mm 368 448
1, 2, and 3 38 mm 272 340
1, 2, and 3 42 mm 312 390

Resources

Related

  • Right to left

Developer documentation

  • UITraitCollection — UIKit
  • UITraitEnvironment — UIKit
  • Responding to changing display modes on Apple TV

Videos

  • What's New in iOS DesignWWDC 2019
  • Essential Design PrinciplesWWDC 2017

FAQs

What is Apple Human Interface Guidelines? ›

Apple's Human Interface Guidelines (HIG) is a comprehensive resource for designers and developers looking to create great experiences across Apple platforms. Now, it's been fully redesigned and refreshed to meet your needs — from your first sketch to the final pixel.

What screen size should I design for iOS? ›

If you target a wider audience, you should use the most popular iPhone screen size: 375×667 pt. If you are developing an application for a more advanced audience who is fond of games, for example, then you should use a screen size of 375×812 pt.

What is human interface design? ›

Human interface design is design that focuses on human-object interactions. There are five principles associated with human interface design; relate to common knowledge, simplify usage, provide feedback, forgive errors, and be appealing.

What is Apple's version of material design? ›

Flat design Vs material design

Google released the material design a few years ago and has become a standard for Android app design. Unlike Google material design, the flat design released by Apple doesn't have an official name. It focuses more on clarity and depth, as a result of which more vibrant colors are used.

How do I make HCI guidelines? ›

Guidelines in HCI
  1. Strive for Consistency.
  2. Cater to Universal Usability.
  3. Offer Informative feedback.
  4. Design Dialogs to yield closure.
  5. Prevent Errors.
  6. Permit easy reversal of actions.
  7. Support internal locus of control.
  8. Reduce short term memory load.

What are design guidelines? ›

Design guidelines are sets of recommendations on how to apply design principles to provide a positive user experience. Designers use such guidelines to judge how to adopt principles such as intuitiveness, learnability, efficiency and consistency so they can create compelling designs and meet and exceed user needs.

What is the most common screen size for website design 2022? ›

The most common screen resolution in 2022 will most likely be 1920×1080. This is because it is a resolution that is currently being used by the majority of users and it is also a resolution that is supported by most devices.

What is the standard size for UI design? ›

320 × 480 is considered a “normal” screen size by Android.

Is Material Design outdated? ›

Material design is still growing, updating, and changing – just last year, Google made their language easier for designers to customise.

Is Google moving away from Material Design? ›

Google says Chrome OS isn't going away, with Material Design refresh inbound. Last week, a report from the Wall Street Journal claimed that Google planned to effectively merge Chrome OS with Android, with the mobile OS taking lead and powering everything from phones to laptops.

Does Google use material UI? ›

First up, Material Design is immediately identifiable and is strongly associated with Google and, specifically, Android.

What are the 4 types of user interfaces? ›

There are four prevalent types of user interface and each has a range of advantages and disadvantages:
  • Command Line Interface.
  • Menu-driven Interface.
  • Graphical User Interface.
  • Touchscreen Graphical User Interface.
Sep 22, 2014

What are the 3 types of user interfaces? ›

The various types of user interfaces include: graphical user interface (GUI) command line interface (CLI) menu-driven user interface.

What are the 3 main components of HCI? ›

HCI includes three intersecting components: a human, a computer, and the interactions between them. Humans interact with the inferences of computers to perform various tasks. A computer interface is the medium that enables communication between any user and a computer.

Why is it important to have HCI guidelines? ›

HCI is critical since it will be necessary for goods to be more successful, safe, helpful, and functional. It will make the user's experience more enjoyable in the long term. As a result, having someone with HCI skills involved in all phases of any product or system development is critical.

What is the importance of HCI in design process? ›

HCI design makes design accessible for every human regardless of their mental or physical capability. A UX designer's job is to make sure that their design sends the correct message and delivers a delightful experience to the user by combining user experience best practices and user research.

What is good design in HCI? ›

A good design in the field of HCI, hides all the working complications from the user and makes it straightforward and effortless for them. The user, will hence feel comfortable and find what they expect to find exactly where they expect to find it, guided by their clear and logical thinking.

What are the 7 layout design guidelines? ›

The principles of design are the rules a designer must follow to create an effective and attractive composition. The fundamental principles of design are: Emphasis, Balance and Alignment, Contrast, Repetition, Proportion, Movement and White Space.

What is the 7 elements of design? ›

The elements of design are the fundamental aspects of any visual design which include shape, color, space, form, line, value, and texture.

Which screen resolution is best? ›

Currently, most people recognize 4K to be the pinnacle of resolution. For laptops and computer monitors, the most reliable threshold is 3840 x 2160 resolution.

What is the most popular resolution? ›

According to the Worldwide Screen Resolution Stats (Jan 2020 – Jan 2021), the most commonly used resolutions across mobile, desktop, and tablet are: 1920×1080 (8.89%)

What is the best size to design a website? ›

It's best to make your website at least 1920px wide.

1280px and 1920px are the two standard widths for web design. A 1280px website will look great on laptops and mobile devices but not so great on large monitors.

How do I design different screen sizes? ›

Designing for Different Screens and Devices: 7 Steps to Creating A Great UX
  1. Identify the Core User Experience. ...
  2. Adapt the Experience for Each Context of Use. ...
  3. Design for Smallest Screen First. ...
  4. Don't Forget About Large Screens. ...
  5. Provide a Consistent Experience. ...
  6. Create A Seamless Experience. ...
  7. Test Your Design.
Jan 6, 2017

What is normal screen size? ›

Most computer monitors range from 19 to 34 inches, measured diagonally from corner to corner. The average user will be happy with 22-24" screens.

What is the minimum screen size? ›

The source doesn't say anything about 320px though. @Muz it's been likely updated since then, but in my experience, 320px still holds the ground as a good minimum threshold for low-end phones.

How do I find my ideal screen size for responsive design? ›

What are the best screen sizes for responsive web design in 2022?
  1. Design for desktop displays from 1024×768 through 1920×1080.
  2. Design for mobile displays from 360×640 through 414×896.
  3. Design for tablet displays from 601×962 through 1280×800.
Jul 8, 2022

What is the smallest screen size to design for? ›

Short answer: 320px. If you want the most remarkable outcomes, you need to measure your audience and consider how much effort you want to make your site/app work for the 0.1 percent of people below your screen-width threshold.

What replaced Material Design? ›

Bootstrap, Material Design Lite, Flat UI, Ant Design, and Material are the most popular alternatives and competitors to Material Design.

Who developed MUI? ›

Material Design
Developer(s)Google
Initial releaseJune 25, 2014
Stable release(s) [±]
Android 1.5.0 / 13 January 2022 iOS 124.2.0 / 26 April 2021 Web 13.0.0 / 24 September 2021
Preview release(s) [±]
11 more rows

What happened to material UI? ›

Material-UI is now MUI. It stands for Material to build UIs. It is quite shorter. Many people already used it for pronouncing Material-UI.

What is the meaning of human interface? ›

What Does Human Interface Device (HID) Mean? A human interface device (HID) is a method by which a human interacts with an electronic information system either by inputting data or providing output. A myriad of HID devices exist. The most common are the keyboards, mice, computer speakers, webcams and headsets.

How do I use Apple interface? ›

How to use your iPad: The Basic User Interface - YouTube

What are the main iPhone user interface elements? ›

The text and icons can be white or black, but the background can be customized into any color and merge with the Navigation Bar.
  • Navigation Bar. The Navigation Bar is used for quick information about the screen. ...
  • Search Bar. ...
  • Toolbar. ...
  • Tab Bar. ...
  • Sidebar. ...
  • Collection View. ...
  • Activity View. ...
  • Alerts.

What is Apple design philosophy? ›

We all crave that new piece of a shiny piece of tech that excites, but yet, Apple's products continue to sell well, and their revenue is increasing every quarter. I believe Apple's conservative product design philosophy rests on three pillars: patience, perfection, and profits.

Videos

1. Get started in Product Design (UX/UI) 2022 - Beginners
(Gemma Helyer)
2. Figma Tutorial: Setup a Responsive Grid Layout for UI & Web Design (IN 11 MINUTES)
(Mizko)
3. Build it in Figma: Create a Design System — Foundations
(Figma)
4. Grid Systems in Web & UI Design
(Jesse Showalter)
5. UI Design Process A to Z [ Part - 02 ] | UI Design System Figma & UI Design Figma
(Essential Web Apps)
6. Let's Build a Design System: Responsive Grid Layout
(Tutorial Tim)
Top Articles
Latest Posts
Article information

Author: Reed Wilderman

Last Updated: 11/30/2022

Views: 6140

Rating: 4.1 / 5 (72 voted)

Reviews: 95% of readers found this page helpful

Author information

Name: Reed Wilderman

Birthday: 1992-06-14

Address: 998 Estell Village, Lake Oscarberg, SD 48713-6877

Phone: +21813267449721

Job: Technology Engineer

Hobby: Swimming, Do it yourself, Beekeeping, Lapidary, Cosplaying, Hiking, Graffiti

Introduction: My name is Reed Wilderman, I am a faithful, bright, lucky, adventurous, lively, rich, vast person who loves writing and wants to share my knowledge and understanding with you.