Photoshop New Document Settings
Action: menu → file → new
Width: 640 pixels
Height: 1136 megapixel (4-inch iphone device)
Resolution: 72 pixels per inch (ppi)
Color mode: RGB color
Background content: White (optional)
Color profiles: Do not color manage this file (after more color settings)
Pixel aspect ratio: square pixel
Configure the following figure:
Alignment settings
This is when you use layers, shapes, and so on to automatically snap to the grid, the vector map is not afraid of blurred edges, to ensure that each pixel remains clear.
Set up:
Menus → views → alignment
menu → view → align to → all
Preferences settings
Action: Menu → edit → preferences → general, recommended to follow the figure set
Enable Light stroke panning
Just a slip effect, accounting for memory can not improve operational efficiency, it is recommended to turn off.
Change the circle brush hardness according to the HUD moving vertically
function pretty good, press ALT + right or up or down move can change the size and hardness of the brush respectively.
Aligning the vector tool with the transform to the pixel grid
It is highly recommended that this feature be turned on so that you do not produce a half pixel virtual edge, which is very useful. However, it can be temporarily closed when micro adjustments are required.
Text Settings
Font I usually set the font to sharp, if you are Photoshop cc version, it has a Windows Lcd/mac LCD anti-aliasing, text can be as effective as the Web page, so it is recommended to upgrade to Photoshop CC bar.
Action: first select text → character tool (AA) choose Windows Lcd/mac LCD
Global Light
Following the Apple iOS HMI guide, you should set the lighting to 90 °.
Actions: Layers → layer styles → global Light →90°
Grid settings
Now the iOS interface is designed to be compatible with the retina (Retina), so I set each mesh to 2 pixels, so I'm not afraid of the image being blurred under the retina device.
Actions: Menus → edits → preferences → guides, grids and slices, grid line spacing: 4 pixels, Subnet 2. or grid line spacing: 2 pixels; Sub Grid 1. I like the former ^_^
Export Settings
Whether we're doing web pages or not, the export image is best exported using the Save as Web format for the iOS app application.
This is done by "Save as Web Format ..." For example, where the default setting is more important, as shown in the following figure: PNG-24
Actions: Menu → file → save as Web format
Presets: PNG-24
Transparent: tick
Staggered: Not checked
Embed color profile: Not checked (available in Photoshop cc version)
Convert to SRGB: not checked
Quality: two times cubic
Retina Monitor Settings
If you are using a MacBook Pro with retina retina, you should make sure that you are using 2800x1800 pixels (1440x900 point)
Action: Apple menu → system Preferences → show → best for display
Color Configuration
Color configuration is a very complex operation, if you are not the great God in this field, then still be honest with the recommended configuration, here I chose the Marc Edwards (http://bjango.com/articles/photoshop) color configuration options.
Summarize
This compass is an introduction to the Phtoshop basic settings for UI design, except for the above, most designers will have their own custom settings, so if you have some technical settings, please feel free to share them in the comments below.
Note : More wonderful tutorials Please pay attention to the triple Photoshop tutorial section, triple PS group: 339853166 welcome you to join
Category:
- PS Getting Started Tutorial