2018 the latest iOS End UI design specification finishing

Source: Internet
Author: User

Turn from: http://www.shui-mai.com/2018zuixiniosduanjiemianuishejiguifanzhengli/


In the iphone 6 is not out of time, are using 640x1136 px to do the design, since 6 of the release, all the design draft size to 750x1334 px To do the design draft size

750x1334px as the original design of the standard size: from the middle size up and down when the adjustment of the minimum amplitude of the interface, the most convenient to fit. Large screen times still use small size as a design size, will limit the design perspective of designers. Design an Android version with only minimal design adjustments to improve design efficiency.

So do the design manuscript, please 750x1334px to do the design draft

iphone Interface design specification:

IPhone Interface Size:

I am accustomed to setting the PX distance, I passed on a lot of app at home and abroad on the line of comparison, summed up is PX more reasonable, this is my personal habits, so also do not as a clear rule, you set for PX, is also possible.

And then you can start your design,

About designing Fonts

Let's take a look at the historical evolution of the font. iOS 9: English fonts for Helvetica Neue iOS 9: Chinese fonts by Holly Black iOS 10: English fonts for San Francisco iOS 10: Chinese fonts for Apple

Design Draft standard text

Text Selection "Ping Fang (Pingfang SC Light)" Title can be bold selection of "Ping square Bold"

text collocation

Generally with 4 and 6 gradient collocation, such as: General text 30px title with 26px details, led list 30px title with 22px Auxiliary information
Details page title text spacing with detail text
A multiple of 8 spacing, such as 24px, 32px, 40px, etc.

Line Spacing setting
Line spacing is 1.5 times times the size of the font

Alignment principle
Paragraph text use "both ends of the aligns alignment", Kinsoku for "strict", the first line is strictly prohibited to put 5 punctuation

questions about font size : Top Action Bar Text size: 34-38px title text size: 28-34px body Text Size: 26-30px auxiliary text size: 0-24px Tab Bar Text size: 20px

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.