发布时间：2021-6-19 分类： 行业资讯
参与项目，我们不仅仅是制作图片，而是将我们的工作与整个项目流程联系起来。
您第一次写作时，可以进行更多沟通。做UI和互动超过两年。在UI设计中，许多开始学习UI的同事，特别是自学习UI，会问这样一个问题，UI设计是什么？
百度百科解释：UI是User Interface的缩写。 UI设计是指人机交互的总体设计，操作逻辑和漂亮的软件界面。
但是，在实践中，许多UI设计只完成了界面美化的这一部分。所有这些都有时会削弱UI设计范围。所以我今天要说的是APP视觉设计的工作流程。参与项目，我们不仅仅是制作图片，而是将我们的工作与整个项目流程联系起来。
第一步
我们需要知道哪些成员在项目中，谁是上游和下游，以及需要导入和导出的内容？我们需要一位交互设计师或产品经理来获取它：
用户任务
页面流程
低保真原型图
确认没有意见并开始处理应用程序可视化设计。某些产品或交互只会提供低保真原型，但会尝试掌握更多流程和用户信息，并引导用户浏览设计中的页面。
第二步
在设计过程中，设计环节主要是指一些规格，具体如何设计页面风格，相信每个人都有自己的风格和想法。在重新设计中，我们应该注意平台插件风格和平台风格，这样更容易赢得用户的信任。
新的640x1136xp画布尺寸，颜色模式为rgb8，像素率为72（根据Apple 5s尺寸的一般设计稿）
确定与企业品牌匹配的应用程序的主要颜色和材料
设计图标
设计整个APP页面，注意，细节丢失不正确？是否提供了按钮点击状态，反馈，缺失状态，超出，加载，卸载，加载失败的单词数量？
页面注释
剪切地图
第三步
设计链接的交付，这个链接对于UI新手来说是一个相对短期的环节，就像平面设计一样，界面设计很好，但如何给它开发，让开发实现产品，它是不是一鸣惊人。
首先，我们知道iOS和Android开发所需的设计可交付成果必须至少具有：高保真UI图（设计草案），注释和剪切。并了解这些可交付成果对发展的作用。
高保真UI图：
高保真UI地图的作用是开发将引用其绘制的页面，只是一种了解页面外观的方法，而不是高精度的东西。因此，IOS和Android不需要具有相同的大小。
标注和切图：
标记和剪切的功能是开发将遵循标签的尺寸，并且剪切图像将根据高保真UI图的布局放置在界面上。
所以问题是，iOS开发和Android开发所需的注释和削减是不一样的。如何在一组iOS高保真UI图表上制作两组注释和剪辑？
首先，ios设计的像素大小为640次; 960/1136（iphone4-5s的大小）
Android主流hdpi模式的像素大小为480次; 800，
可以得出结论，他们的转换关系是iOS @ 2x像素大小* 75％=Android hdpi像素大小。 （480÷ 640=0.75宽度比）
1> ios size
Iphone一代或两代：320x480px
@ 2x iphone4-4s：640x960px iphone 5,5c，5s：640x1136px
Iphone6：750× 1334 px
@ 3x iphone6 puls：1080x1920px
2> Android主流尺寸
Idpi 240x320px 120ppi（像素密度）
Mdpi 320x480px 240ppi
Hdpi 480x800px 160ppi
Xhdpi 720x1280px 320ppi
Xxhdpi 1080x1920px 480ppi
每个Ios大小的比例是@：@ 2x：@ 3x=0.5：1：1.6875
Andriod的每个尺寸的比例是idpi：mdpi：hdpi：xhdpi：xxhdpi：xxxhdpi=0.75：1：1.5：2：3：4
在iOS剪辑和Android剪辑的转换中：
因为：iOS @ 2x像素大小* 75％=Android hdpi像素大小
所以：在iOS @ 2x降低75％之后，这是Android的hdpi模式下降，
因为：hdpi：xhdpi=1.5：2=0.75
所以：iOS @ 2x剪切图是Android xhdpi的剪切尺寸
另外，可以得出结论，在手机APP设计中，当两个版本的IOS和Android看起来相同时，设计草案就不同了。根据IOS和Android的切割阶段，我们可以单独制作ios @ 2x的设计草案。转换关系不同于剪切所需的不同尺寸的不同版本。
注意：缩放后像素将粘贴在一起，可能需要重新调整，以及各种虚拟边缘，尤其是具有透明阴影的虚拟边缘。
Andriod的像素大小转换为开发大小，即：px转换为dp
我们使用480 * 800像素的设计图作为基准。
将分量大小转换为dp大小的方法是使像素大小为* 2/3。 480像素* 2/3=320dp
这就是为什么你希望Android组件可以按大小整除。例如，在hdpi模式下，在480 * 800像素大小的设计中，开发会看到300px宽度注释，其定义为200dp宽。在这里，Android开发获得了他们实际用于开发的价值。
以上关系：iOS @ 2x像素大小* 75％=Android hdpi像素大小
Android像素大小* 2/3=Android hdpi dp size
绘图：iOS @ 2x像素大小* 75％* 2/3=Android hdpi dp size
所以：iOS @ 2x宽600像素，在Android hdpi模式下，正好是300dp，正好是50％，
第四步
这是接受和发展的结果。我们不仅设计页面，还让他最终在产品中显示它。因此，在开发完成后，我们需要检查界面效果是否与我们的设计一致。如果它是一致的，或者由于开发原因没有办法实现它，我们必须修改设计方案，我们注意设计时的开发难度。
最后的总结是在APP UI设计中，从低保真原型到验收产品，它是UI设计师在项目中的工作。它还可以根据个人能力扩展到用户任务的界面交互和交互设计。
这些只是我个人的一些工作经历以及一些文章中总结的一些内容。我希望每个人都可以呕吐和交换更多！
本文最初由@可published发表。未经许可，禁止复制。
该地图来自usnplash，基于CC0协议
