training session ios ui guidelines
DESCRIPTION
A very informative training session by E2logy on iOS UI guidelinesTRANSCRIPT
![Page 1: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/1.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
iOS UI Guidelines
![Page 2: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/2.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Design Principles
Aesthetic Integrity – It represents how well an app's appearance and behavior integrates with its function to send a coherent message.
Consistency – It lets people transfer their knowledge and skills from one part of an app's UI to another and from one app to another.
Direct manipulation – When people directly manipulate on screen objects instead of separate controls to manipulate them, they are more engaged with their task and its easier to understand.
Feedback - Acknowledge people's actions, show them results, and updates them on the progress of their task.
Metaphors - When virtual objects and actions in an app are metaphors for familiar experiences users quickly grasp how to use the app.
User Control – People – not apps – should initiate and control actions.
![Page 3: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/3.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
From concept to product
Define your app.List All the features you think users might like.Determine who your users are.Filter the Feature list through the audience definition.Don't stop there.
Tailor Customization to the task.
Prototype & Iterate
![Page 4: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/4.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
1 – Defer to Content
Take advantage of the whole screen Reconsider the use of insets and visual frames and—instead—let the content extend to the edges of the screen.
![Page 5: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/5.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
1 – Defer to Content (contd..)
Let translucent UI elements hint at the content behind them
Translucent elements—such as Control Center—provide context, help users see that more content is available, and can signal transience.
In iOS 7, a translucent element blurs only the content directly behind it—giving the impression of looking through rice paper—it doesn’t blur the rest of the screen.
![Page 6: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/6.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
2 – Provide Clarity (Contd..)
Embrace borderless buttons
In iOS 7, all bar buttons are borderless.In content areas, a borderless button uses context, color, and a call-to-
action title to indicate interactivity.And when it makes sense, a content-area button can display a thin border
or tinted background that makes it distinctive.
![Page 7: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/7.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
2 – Provide Clarity
Let color simplify the UI
A key color—such as yellow in Notes—highlights important state and subtly indicates interactivity.
It also gives an app a consistent visual theme. The built-in apps use a family of pure, clean system colors that look good at every tint and on both dark and light backgrounds.
![Page 8: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/8.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
3 – Use Depth to Communicate
Reminders displays lists in layers, as shown here. When users work with one list, the other lists are collected together at the bottom of the screen.
![Page 9: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/9.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
3 – Use Depth to Communicate (Contd..)
Calendar uses enhanced transitions to give users a sense of hierarchy and depth as they move between viewing years, months, and days. In the scrolling year view shown here, users can instantly see today’s date and perform other calendar tasks.
![Page 10: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/10.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Bars
Status Bar
Navigation Bar
Tool bar
![Page 11: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/11.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Tab bar
![Page 12: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/12.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Tab bar
![Page 13: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/13.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Activity View Controllers
![Page 14: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/14.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Collection View
![Page 15: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/15.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Map View
![Page 16: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/16.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Page View Controller
![Page 17: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/17.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Table View Controller
![Page 18: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/18.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Table View Elements
![Page 19: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/19.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Layout
![Page 20: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/20.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
![Page 21: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/21.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
![Page 22: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/22.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
Facebook Paper
![Page 23: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/23.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
BookMyShow
![Page 24: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/24.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
COOKBOOK
![Page 25: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/25.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd
iOS 8
![Page 26: Training Session iOS UI Guidelines](https://reader031.vdocuments.mx/reader031/viewer/2022013011/5582100fd8b42ac7728b46db/html5/thumbnails/26.jpg)
Confidential. © E2Logy Software Solutions Pvt Ltd