UI Designers are the only designers who have to work with programmers , We've seen a lot of jokes about each other , So what UI Designers are the best in the eyes of programmers ? Among them are 3 Levels .
<>1. understand UI
you 're right , The first is to understand UI.UI The designer designed the human-computer interface , The carrier of interface is equipment . This is the difference between other designers . Different equipment has its own characteristics and requirements , Understanding equipment knowledge is the common goal of programmers and designers , It's the basis for them to find a common language .
Designers need to understand these things ：
* Controllable basic properties ： typeface , Glyph , Size and unit , Height and width , Space left blank , colour （256 colour ,RGBA）, Gradients , fillet , transparency , shadow , Alignment , Hierarchy .
* System components （ navigation bar , menu bar , taskbar , Dialog box, etc ） Size of , Style , Interactive form , Version differences .
* Custom components ：1/2/3 Level title , text , prompt box , Button , Popup , Selection box , Drop down list , Icon , Various cards ……
* State change ： ordinary , hover （hover）, Select / activation （selected/active）, Not available （disabled）.
* animation ： position , size , colour , transparency , Changes in shape , And the duration can be controlled , Velocity curve , loop .
* grid ：2,4,8,16,32 Multiple alignment of .
* Screen adaptation ： size , Aspect ratio , Pixel density （2x,3x,hdpi,xhdpi……）, Variable size rules for components .
* Multi language adaptation , The longest compatible language
<>2. Understand the standard
Junior designers want to do more practice , Every project, even every need, is creative once . Gradually , In the repeated work, we know that we should solidify and utilize certain things , It can reduce the workload of oneself and programmer , Can unify the design style again , So norms came into being . Standardization is the best practice to improve the efficiency of collaboration between designers and programmers . These are the things that can be standardized ：
* Basic attributes
* Platforms （iOS,Android,Windows） Design style specification under
* Custom components
* Cutaway ： File naming specification ( All lowercase English , Underline connection ), What is the need for transparent borders
* tagging ： It should be marked up , All sizes are even
* Design iteration ： Manuscript version number management
* maintain ： Manage all used cutmaps , In each iteration of the product, in addition to adding new graphs, the obsolete ones will be eliminated before they are given to the programmer as a whole
Determination of these specifications , In addition to relying on design capabilities , You also need to understand the implementation mechanism of the development
. Be aware of development constraints , Can't make the effect that is difficult to achieve , Measure development and maintenance costs at the same time . For example, understanding “ Take the upper left corner as the origin coordinate system ” Only by using the development positioning mechanism can we mark all the labels ;web The font size of the item cannot be less than 12px, Otherwise, the latest browser will not take effect .
in addition , Whether the execution specification is in place is one of the criteria for programmers and designers to evaluate each other , This requires enough care on both sides . It will be tangled during acceptance 1px or 1 The designer of numerical color deviation , Not only won't be annoyed , Instead, it's seen as a sign of dedication . If anyone can use or develop tools —— Such as automatic marking or code level verification and inspection —— To enhance collaboration , It will be regarded as a God .
<>3. Understanding design
Aesthetics is possessed by everyone who has feelings , If UI Technology can be seen in daily work, which is naturally respected . To this level , Yes UI The designer's request returns to the design itself , The most basic is to use the general design method to the product .
The following creative techniques and the use of consciousness , In the eyes of the project team, they are all professional ：
* Color application
* Rendering emotional atmosphere according to business objectives . For example, e-commerce websites use red , Yellow is the main color , To excite users , One impulse leads to buying behavior .
* In line with product characteristics , For example, green represents safety , Blue represents technology
* In line with user characteristics , Comprehensive consideration of gender , Age and other factors , For example, pink is suitable for women , Bright colors for the elderly
* Strong sense of hierarchy , Highlight key points
* Style control , Cater to the preferences of user groups , for example ： soft , youth , steady , Simulacrum, etc
* Cool animation without dominating the audience
* individualization , Like a skin change
Some of these are skills of visual designers , actually UI Designers' penetration into other design fields is a natural upgrade after the design level reaches a certain level . We can expand in these areas ：
* Advertising and graphic design
* Design concept ： Be able to explain the ideas and benefits of this design to project team members , And what information do you want to convey to users through design
* Non functional area （ For example, the guide page ） Marketing copywriting
* Design of operation materials
* Interaction design
* Take over the responsibilities of the product manager , Design interface and interaction process directly according to business process
* Familiar with user experience theory and optimization method
* Human computer interaction guide familiar with platform features
* Clear business oriented design objectives , For example, guide users to impulse consumption
* VI Design
* From products UI Evolution to enterprise logo,slogan
* mascot design
* UI Design expansion affects business cards , packing , Mail signature bar, etc
* product design
* Be able to correct interaction logic omissions in product documentation
* Study the design concept of competitive products and surpass it
* Web Design
* The front end is the closest UI The development of designers , Understand HTML/CSS/JS You know more about programmers
last , Just like programmers , If designers can improve their English , Direct reading and learning foreign materials , Will be very helpful to keep up with international design trends , Improve skills . After all, the operating system and UI Most of the design trends are invented and led by foreigners , We are looking forward to leading the industry in China .