app网页如何设计

1、App 设计与 web 设计的主要区别是什么

从使用场景上，Web App用户面临比原生APP用户更严峻的问题：
1、页面跳转更加费力，不稳定感更强
思考点：如何减少跳转（扁平结构、页面布局技巧），增加数据及展示的流畅流程及稳定性（技术）。

2、更小的页面空间（由于浏览器的导航本身占用一部分屏幕空间），更大的信息记忆负担；
移动设备的屏幕要小得多。这种如同透过门缝进行的阅读增加了认知的负担。人脑的短期记忆是不稳定的，用户在滚动屏幕的过程中需要临时记忆的信息越多，他们的表现就会越差。——《贴心设计：打造高可用性的移动产品》
思考点：排版更清晰、信息更简练 （可在原生APP基础上去掉一些丰富、复杂的视觉表现）

3、导航不明显，原有底部导航消失，有效的导航遇到挑战
思考点：如何有效的提供导航？有哪些形式？

4、交互动态效果收到限制，影响一些页面场景、逻辑的理解。
思考点：比如登录注册流程的弹出、完成及异常退出，做好文字提示。

区别：APP属于手机应用客户端，移动网站可以制作成APP，APP也可以呈现手机网站。

相同点：二者都属于手机系列 区别在于：APP可以安装到手机上，而移动网站只能通这用户打开网址才能打开了解信息。如果移动网站设计成app，则二者兼合。

2、如何成为一个APP前端UI设计师

了解平台
正如同web设计师需要了解HTML/CSS一样，作为移动端UI设计师应该了解移动端APP的架构。首先移动端开发的语言和网页设计就不太一样，各个不同平台有着各自的编程语言和接口，界面的构成也无法使用CSS和标签来实现。需要深入阅读官方的开发文档，明白APP的构成，编译方式，发布方式，了解设计的规则。这些东西不仅关系到应用开发好坏，还会影响系统的稳定性，电池续航长短等多种因素。作为移动端UI设计师，单了解设计是不够的。
了解移动端的技术构成
光了解平台的基本特征是不够的。接下来需要了解相关的技术构成：位置服务（wifi，GPS等），蓝牙（低功耗蓝牙技术），信号，前后摄像头，麦克风，陀螺仪，位置传感器，加速度传感器，指纹扫描仪（iPhone 5s），眼动追踪技术，语音识别，人脸识别，等等等等。每一个新技术的背后以为着应用程序更多的可能性，交互设计、使用体验，甚至商业模式。
发掘本地UI组件的开发潜质
每个移动操作系统中中总有着大量的本地UI组件，有着极大的自由度，方便进行定制。需要确切地知道特征（尺寸，大小，功用），可以为合作的开发者节省大量的工作时间。
了解移动端的工作流程
安装SDK并运行，了解移动开发框架，比如TubyMotion、Xamarin、Titanium。熟悉集成开发环境，因为这其中包含了移动开发所需的方方面面。
了解移动端的界面模式
三大移动平台之间，有着相似之处，但是在深入探究交互设计，会发现在理念上的巨大差异。作为一个设计师，需要明白这些差异所在，以及是如何体现在实际案例中的。
不要只着眼于单一平台，三大平台都需要深入体验，每天至少都要把玩一下，并且最少要持续半年。在这个过程中，体会差异，并且将觉得重要的、有代表性的、值得保存记录的界面截图留存。
记录并解释你的UI设计
考虑到屏幕截图并不足以表现UI全部的特性，需要学会记录界面不同的状态、转变过程、转场动画等信息，并且学会记录界面对于不同状况的反馈。
在设计阶段践行精益UX设计
一个现代的设计师应该是具备战略眼光的设计师。目标不能局限于闷头制作漂亮的界面，你应该让设计与团队合作结合到一起，切合项目需求。洞悉用户深层次的需求，并且能快速地随之反馈到设计上。将设计作品保存下来并附上详细的说明，确保所有的设计都与核心理念保持一致，与用户需要保持一致。
在开发阶段采用敏捷UX设计
不能只将高保真的模型交给开发者就了事，因为在开发过程中会不断提出新的需求。总会有之前考虑不周全的情况，需要在开发阶段进行补充完善，设计师需要随之进行快速响应。所以，在这个阶段，设计师真的需要坐在开发者旁边应付突发情况。确保开发者在碰到新的需求的时候，不用开发者自己来补充UX的细节，或者再来找设计师。

3、设计PC端网页原型和手机端APP有什么区别

1、内容上pc端一定是内容丰富的，app一定是内容精简的
2、从产品功能架构上，app端的设计通常只能满足主流用户的常用功能，相反pc端可以兼顾更多的用户提供更全面的服务
3、相比pc端，app更注重用户体验设计，例如操作流程简单快捷，语言文字精简移动。
4、升级优化方面，pc端通常适合于两年一小改，三年一大改，指的是改版。app则比较频繁，且第一版本一般只是先主要功能，之后2、3个月几乎就要出一个小迭代版本。

4、app分享h5页面ui怎么设计

若是你有基础，比如是平面设计出身，PS，AI都很厉害，那么就是缺乏交互方面的知识或者是其它的UI知识，那么我建议可以去报一个专项学习班，差哪儿补哪儿。当然也可以根据自身的情况选择自学。不过一般转行业说明你差不了那几个钱，能够花点钱帮助你快速转行，相信还是非常划算的，或者百度文库相关资料，介绍全https://wenku.baidu.com/view/.html?from=search

5、如何开发设计APP

千夏软件（www.qianxx.com）表示一个APP项目的最初首先要确定项目整体方案，整个项目的规划，大体框架，做成文档展现出来，以便大家提意见和更好的改进。也就是说首先要确立产品原型，进入项目评估阶段。经过反复确认，最终形成产品脑图和完整的需求文档。
2.功能设计—APP项目概要设计
第二步相当于网站的需求分析，需要整理确定App的主要用户群体和APP能实现的功能。关于APP开发设计可以在DevStore平台上借助一些工具来充实你的APP，像结合推送、地图、社交分享、第三方登录等常用的工具让你的APP更丰富一些。借助第三方服务来丰富自己的作品是很好的借力途径，一定不要错过，平时要养成收集平台的习惯，例如工具平台，学习交流平台，养成总结整合资源会是受益一生的好习惯。
3. 功能实现—APP项目打码阶段
APP的大概界面构思和设计，大功能模块代码编写。正式进入产品的原型设计阶段。UI、UE开始设计，形成初步的效果图。在经过确认后界面的效果图正式设计完成。产品在设计图完成后，进入研发阶段。通过编程语言形成正式的程序。至此，App的制作过程就完成了一大部分，可以进入测试部进行测试。作为一个开发者来说这才是重头戏，设计，测试都是别人的事情，这一步主要是开发者努力打码阶段，不断码砖，修bug阶段。
4.测试—APP项目大家评
把大概的界面和功能连接后，App的大致demo就出来了，demo自己试用和体验几遍后，根据实际情况修改，没有大错误后，新版本可以尝试寻找beta用户， 根据测试用户的反馈，改进并反复测试。用户测试阶段一定要把每个用户的意见考虑进去，不一定每个意见都会采纳，但是不要放过一点瑕疵，尽全力让自己的作品更好。
5.APP项目完成
在产品经过多次测试，修改bug确认无误后。一个App制作项目就完成，可以进入个大市场，投放使用。市场推广也是比较关键的一步，在各大市场中，开发者就要通过各种方式推广自己的App产品，力求App在市场上获得更多的下载量，吸引更多的用户。

6、如何设计好app里的个人设置页面

css属性 overflow-y:auto; DIV里面的内容超过DIV的高度，右边就会自动出现滚动条1、用一个div，定制成图中的宽度和高度2、然后再把div的样式设成overflow-y:scroll，当div里的文字超出那个高度的时候，滚动条就出来了。例如：<div style="width:100px; height:100px; overflow:auto; border:1px solid #000000;"><img src="" style="width:300px; height:300px;"></div>

7、#ui设计师#一个App和网页设计的流程是什么样的？能详细说明下吗？

APP设计流程 接到项目，先进行市场分析确定他的可行性，然后对目标用户分析确定他的可用性，竞品分析，吸取竞品的优势，根据用户研究做出原型图设计，再根据原型图进行优化升级，做出合适风格的高保真图，最后切图，标注给开发人员。
网页设计流程 网页的话很APP进行的差不多，前期分析，而后根据企业特性，公司文化，公司特色，公司形象，展示自己的优势，做出让用户易操作，易识别，易用性高的网站。 来自职Q用户：用户3780419
行业定性-市场方向-市场调查-潜在用户-确定功能-开发流程（原型图-视觉图-开发-测试）等 来自职Q用户：匿名用户

8、如何说一个手机app的设计理念？

第一：品牌

品牌是应用设计的基石。它回答了“用户使用应用时应该获得何等感受”这个问题。

首先，你应该确定你的主要目标人群或者产业是哪些：儿童，青少年，专业人士，妈妈，学生，医生，设计师，老年人，等等。应用的设计风格必须与品牌相一致，这样才能建立更强的品牌认知，并消除用户疑虑。

例如，为老年人设计的社交应用就应该用大号字体，而股票交易应用就得有策略地使用安全锁图标来让用户有安全感。如果可能，你还该考虑为品牌找一个吉祥物。吉祥物可以将品牌拟人化，同时强化应用留给用户的印象。

第二：颜色方案

颜色方案决定了应用的形象，它应该是品牌主题色的扩展。

它是视觉设计的核心，因为应用所有可见的地方都会使用这些颜色。首先，你需要选择一个能增强品牌形象的主题色。例如，Evernote的主题色是绿色。然后，你应该围绕这个主题色来创建颜色方案。亮色可以吸引人的目光，所以适合那些消费导向的应用;中间色可以让人把精力集中在信息本身，所以更适合专业性的应用。

Parable的主题色是“Tangelo橙”，因此我们选择了灰度作为主要颜色方案，这也符合我们一贯的时尚创意。另一个例子是SnapChat，它使用了华丽的亮色方案来吸引青少年用户。

第三：直观

在高度竞争的应用市场，根本没时间让用户仔细品味你的应用——我们讲究的是“一见钟情”。能让你第一眼就明白其功能的应用才是最好的应用。

有一个管用的小方法，就是去研究一下那些热门应用是怎么做的，尽量别让用户产生困惑。然后，要全面地测试所有的交互环节，充分优化应用。到达最重要的交互环节之前，用户的操作步骤不能超过三个，例如，发布到Meerkat上只用点一下，发布到Instagram上只用点三下。一些用户熟知的平台上有特定的交互方式，使用它们往往会效果拔群。

第四：愉悦感

用户评价应用的首要标准是体验。

想要获得死忠用户，你必须得提供一些意料之外的愉悦感。随着时间的推移,这些愉悦的体验就会给用户留下深刻印象，从而让应用成为他们日常生活必要的一部分。

像Pinterest和Parable里点击分享时候出现的动画，还有刷新SnapChat时候的动画，都是很好的例子。

第五：精炼

卓越的视觉设计都是细节为王，每一个像素都要完美无缺。首先是排版。字体是应用的脸面，一个好的字体可以让你的应用脱颖而出。

你可以从50多个iOS字体中精心挑选一个来;当然，如果你能购买并制作属于自己的字体那就更好了——总之，千万别吊死在默认字体这棵树上。Serif字体适合长文章;san-serif字体可以使用更多字体大小而不让页面看起来拥挤。紧凑型字体可以让屏幕上显示更多文字，但它跟普通字体放一起就会很奇怪。接下来，我们来谈谈图标的问题。能准确传达情绪的图标才是最好的。你可以利用一些免费的图标资源，然后在Photoshop里面稍加修改，把它们变成自己的图标。

当创建纯色图标时，坚持使用单一色彩可以避免让用户感到拥挤和混乱。最后,让我们把重点放在视觉资源上。Post-skeuomorphic时代让资源开发变简单了。我们应当尽量在代码中进行渲染，以尽可能地缩小应用包。添加资源时需要确保它们能正确匹配屏幕大小;粗制劣造的一大表现就是资源的像素化。

第六：简化

开发者总喜欢添加一些复杂的导航界面或者用无关的信息，结果把界面搞得一团糟。这简直让用户崩溃。

让一切保持简单!屏幕布局应当保持整洁，信息应该分层排列，重要的在上面，不重要的在下面。只显示相关度高的细节，用统计工具分析有哪些动作是没用的，然后把它们删掉。可以借鉴苹果的理念：无赘物即为完美。分析下面这个简洁的Pinterest个人主页。

它把用户和分块展示区放在一起，最重要的关注和点赞按钮被小心地放在了合适的位置。要做最佳应用则需更深刻地贯彻这一原则，让内容动态化，例如在滚动浏览时导航栏要随着动画隐藏，再如在多步骤的交互中要隐藏按钮。

9、网页设计html5和制作手机app的软件用法一样嘛？有什么区别？

不一样吧，HTML是超文本语言，也是一种计算机语言，编程的一种语言，而手机软件的语言好像是Java语言，当然，现在有那种无需会编程就能生成手机软件的工具，不过这局限很大。

10、App中的空白页面应该如何设计？

我认为做一个产品面向于用户时，就像是跟对方交流一样，你的语言就是你的App所呈现给用户的内容。你需要用你的界面跟你的用户去对话，沟通，才能让你们之间的交流顺畅且具有持久的粘性。

所以说，每一个页面，你都需要设计的合理，以便让这个页面在被用户看到的时候，是可以说话的，是对方能理解的，是可以引导对方去跟你交流下一步的。

好了，回归话题，App的空白页。

第一个问题，你的App为什么会产生空白页面？

App启动的时候（冷启动，无内容）

App出错的时候

用户内容为零的时候

先说App启动的时候。

如果用户第一次打开你的App，你需要有一个靠谱的开场白来让你们迸发出第一句话吸引到你的用户。所以建议在App启动的时候，页面最好有一些预置的内容。比如说，你的App中的内容需要用户注册或者是登录后才能使用。所以很多App一上来就以一个生冷的画面，要求用户去注册或者是登录。换个角度，你是用户的话，遇到一个一上来让你掏身份证的人，你会跟他继续交流么，肯定不会啊。

所以，这个时候你应该预置一些内容，比如一些吸引的跟登录后的内容有关的资讯类的东西，让用户先行浏览，浏览后用户后下一步欲望操作的时候，你要求他登录。

如果，实在是没有什么优质内容可以免登陆查看的话，那么，可以让你的第一个页面更加“性感”、“有意思”，吸引用户“渴求”进一步操作，“渴求”与你的对话沟通。这个时候，就要考验你的设计团队能力了，不过，作为产品经理，你需要有自己的核心想法并且传递给你的设计团队。

然后，App出错的时候。

这有可能是用户操作失败了，或者是网络失败了，或者是其他什么问题。无论是哪种情况，都是需要“和谐”的对话的。这就像是你跟用户交流的时候，突然出现故障了，你需要站在你的用户的角度想想，遇到聊天中断的故障时，用户的第一反应是什么——“我擦，出什么事了”。看到了吧，不安的焦躁的情绪。所以你的第一任务是——安抚你的用户，安抚你的聊天对象。安抚的方法可以是你的页面展示元素，也可以是一句温馨的打趣的好玩的话。

用户的情绪稳定后，第二反应是——“为什么会这样”，你要用最简洁的语言跟对方解释清楚为什么会这样，例如“网络连接失败”

用户知道出错原因后，第三个反应是——“我该怎么办”，你需要有直观的引导方式来告诉用户应该怎么操作才能解除这个问题，例如“稍后再试”、“立即刷新”、“去设置网络”

此处，建议页面设计地应该有一些灵动性，符合你的App整体风格，或严肃，或卖萌，或调侃，或温情。

然后，用户内容为零的时候。

这有可能是用户删除了整个页面的内容，也有可能是用户误打误撞进来了一个无内容的页面。OK，anyway，这个页面啥也没有了，也没有出错，遵循页面功能的原则，也不能出现该页面功能无关的内容。还是跟聊天一样，试想一下你和用户正在交流，他问了你一句话，你无法回复给他答案。这个时候你应该怎么做呢？是应该站着不要说话？NO，no，当然不是，这样你聊还怎么继续聊天。你需要做的就是告诉他“不好意思，我没有什么可以回复的了”。so，这个页面，第一个要表现的元素就是——“页面内容为空这一事实”。其次，为了让你们的对话继续下去，你可以建议你的聊天对象做点对应的事情，会不会让聊天更有持久性。比如，你们的对话可能是这样的“不好意思，我没有什么可回复的了，不过你可以看看那儿没准可以让我回复”。so，这个页面的第二个要表现的元素就是——“建议用户可用的操作”

OK，先讲这么多，有问题可以单独留言给我~