ui设计的学习方法

2023-02-16 版权声明 我要投稿

第1篇:ui设计的学习方法

UI扁平化设计的基本方法

【摘 要】目前扁平化设计就像狂风一样全面席卷了整个UI设计界,无论是网页设计还是APP设计,大家首先考虑的就是采用扁平化。本文通过对HTC网站设计案例的改版设计,详细分析了扁平化设计风格的设计要素,提出了扁平化风格的设计方法。

【关键词】UI设计;扁平化;方法

自从苹果公司的设计师们放弃拟物化设计,全面采用扁平化设计以来,扁平化设计就像狂风一样全面席卷了整个UI设计界。无论是网页设计还是APP设计,大家首先考虑的就是采用扁平化。扁平化的设计俨然已经成为有别于拟物化设计的一种全新的设计思维方式,完全颠覆了拟物化的设计风格,开创了一个UI设计的新时代。

扁平化设计风格将一种干净、简洁的设计情绪带到受众面前。这种设计风格实际上在现在所谓的扁平化风格出现之前其实已经被大量应用,只是在设计手法上没有扁平化的设计那样极致。例如HTC官方网站的中文版,就是一个典型的扁平化时代之前的设计,但整体的设计风格与扁平化的风格类似,都是简洁、干净的设计风格。其实,如果我们将这个设计中导航条、搜索框等元素中的高光、阴影去除掉,将其中的图标元素更换为非拟物化的图标的话,几乎不需要在版式做其他的变化,这个网站的设计马上就可以变为扁平化的设计。

扁平化的设计如此的流行是因为它更加适应于移动终端设备的小尺寸屏幕。扁平化的设计风格更加适合在手机、平板电脑等小屏幕上进行操作。但把扁平化的这种优势放大到能够颠覆整个设计思维方式的话,无疑是夸大了它的影响。扁平化的设计也有它自身的缺陷,如果将其用在稍微复杂一点的界面中,扁平化设计会带来很多困扰。因此无论它应用的再广泛,扁平化也仅仅只是一种風格而已,在大尺寸的屏幕上,例如网页方面的设计,没有必要都采用扁平化的设计。

当然,本文并非是要把扁平化与拟物化的设计好坏做出比较,相反,作为一种设计风格,扁平化的设计风格如此流行,我们的设计师们更加应该掌握这种设计风格的特点及表现手法。

以下我们就用上面HTC设计案例的改版来详细分析一下扁平化设计风格的设计要素,掌握扁平化设计风格的设计方法。

那么扁平化的设计有哪些设计特点,我们又该如何动手将这个设计改版为流行的扁平化风格呢?我大概梳理了一下,基本的步骤应该包括以下几个方面:

一、梳理网站信息

根据网站目的和诉求梳理网站信息,这是无论做哪种风格的网站设计都要做的第一步工作。信息梳理的工作非常重要,它直接关系到一个网站的目标能否达成,想想最重要的信息由于缺乏整理没有在页面的重要位置和视觉方面体现出重要性,无论设计的再美观,也是无用的。但我们经常所看到的情况却相反,一个网站的首页被重要不重要的信息塞的满满当当,每一个子页面的内容都要在首页上占据一个位置,什么产品展示、新闻资讯、常见问题、专题活动都出现在首页上,这样做的结果就是让次要的信息冲淡了重要信息的比重,信息的主次得不到体现,访问者浏览过网站后似乎什么都看到了,但却没有留下深刻的印象。时刻要记住,设计不是为了漂亮,更不是为了炫技,而是为了便捷信息的沟通。信息的梳理工作在扁平化的设计中显得更加重要,因为扁平化的设计就是要体现简洁、干净的特点,页面上的信息太多,就不太容易做出这样的视觉风格来。

所以对于HTC网站的手机页面来说,Logo和导航的内容不用多说,导航作为网站信息组织结构的体现是非常重要的一个元素。HTC是一个生产和销售手机的企业,那么可想而知,首页上最重要的信息当然是最新产品的展示,其次是最新的专题活动以及特色产品的展示,其他的例如企业新闻、产品支持服务搜索等内容大可不必在首页中出现,因为这些信息相较于前面提到的信息来说,没有那么重要,完全可以只在内页中体现即可。

二、设计方案和版式选择

网站的信息确定之后,我们就可以着手来制定更为详细的设计方案。首先需要确定的是版式,也就是网站的布局。在扁平化风格的设计中,由于设计中常使用特别简单的元素,所以排版就变得非常重要,成为了设计中出彩的地方。扁平化设计中常见的排版方法是用矩形来划分页面中不同的信息区域,例如下面的几个案例所示,可以看到无论是整体页面的划分或者分栏信息的划分,矩形在其中扮演了非常重要的角色。

以扁平化的设计风格来看,之前的HTC首页的设计导航部分的创意显得过于复杂,将主要内容固定在一个宽度内的板式看上去也过于小气,所以我们将目前已有的版式更改为通栏的布局方式。放弃目前导航的设计,将导航文字直接放置于通栏的导航条上,banner部分的设计也做同样的处理,banner下方是最新的活动信息,各个活动信息区域用矩形划分开来。

三、色彩和字体方案

接着需要确定的是色彩方案。在扁平化的设计中,多采用纯度低、亮度高的颜色。高亮色彩的使用让整体的设计风格更加清新。所以,我们取一下HTC的logo的颜色,但这个纯度偏低,亮度较高的绿色正符合扁平化的设计风格,所以直接拿来用就可以了。在新的设计中,我们依然采用前面设计中的配色方案,白色的背景色、logo中的绿色作为主角色,不同层次的灰色作为配角色来进行设计。

在设计的质感上,非常重要的是需要去除掉所有之前设计中拟物化的表现方法,例如高光、阴影、纹理等等。这也是扁平化设计的概念最核心的地方——去掉所有冗余的装饰效果,让“信息”本身重新作为核心被凸显出来。字体选择方面,为了契合简洁、干净的设计风格,我们采用非衬线字体,微软雅黑作为正文字体,banner部分的设计可考虑尝试更为纤细的字体,例如方正兰亭超细黑简体。至此,我们基本可以确定整个页面的视觉效果。

四、细部的处理

接下来需要的是进一步细化设计方案。banner部分的设计是整个页面设计的重点。它是整个页面中最重要信息展示区域,就像我们在前面提到的,这部分区域应该用来展示最新的产品,所以在banner的创意上我们计划将实实在在的产品展示出来。可以选择一款HTC的高端机型作为banner部分的视觉主元素。将其放置于banner区域,调整一下色相、亮度,然后再键入宣传语,搭配上相应的按钮和链接。

Banner下方的分栏信息部分,分别放置手机配件、HTC如影摄像头、免费更换服务三个信息栏目,为了让分栏信息的排版不过于单调,可以将本来的四栏布局更改为三栏布局,将中间栏目的宽度放大,这样在版式上有所变化,看上去更灵活一些。分栏信息的设计创意全部来自于HTC现有的网站,这里完全不用再做另外的创意。分栏信息部分的色彩可通过调整图片的颜色,依然保持以绿色为主色调,辅以灰色搭配的方法,这样更加符合之前确定的色彩方案。

最后是页脚导航和版权信息,这部分的信息不是页面的重点,只要做到契合整体页面的设计即可。

(作者单位:重庆工贸职业技术学院)

作者:潘宏铭

第2篇:基于问题式学习的网站UI设计课程优化与实践

摘 要 问题式学习是一种以问题为导向,倡导学生通过研究、讨论、协作解决问题,注重培养学生的能动性、协作性和探索实际运用的创作能力。在简要阐述“网站UI设计”的课程背景、教学现状、教学目标之后,从课程内容的重构、教学模式的创新、考核标准的改变这三方面进行优化。并以大二网络与新媒体专业学生为实践对象,依据“提出问题—分析问题—解决问题”的思路来设计各教学环节,并要求学生分阶段产出学习效果。实践表明,把学习置于真实的或者贴近实际的大问题中,能激发学生的学习兴趣,提高学生的网站综合设计能力,体验并形成完整的产品设计理念。

关键词 网络与新媒体专业;问题式学习;网站UI设计;教学模式

Curriculum Optimization and Practice of Website UI Design based on Problem-based Learning//LAN Liping

work and new media professional students, on the basis of the pro-blem-analysis problem-to solve the problem of the train of thought to

design the teaching process, students are required to study the effect of real estate in stages. Last, practice shows that the learning in real

or practical problems, learning interest and ability to stimulate stu-dents, improve the comprehensive ability of students' experience of website design, product design concept and form complete.

Key words network and new media; problem-based learning; web-site UI design; model of instruction

1 課程背景

网站UI设计这门课程是广东技术师范学院网络与新媒体专业大二学生的一门专业必修课。UI,即用户界面(User Interface)。UI设计的范畴很大,其中应用最广泛的是网站UI设计,随着移动终端用户数量的迅猛增长,目前大多数网页在开发Web端网页的同时,也需要开发相应的移动端网页。网站UI设计作为网站建设的第一个环节,是指对软件的人机交互、操作逻辑、界面美观的整体设计。优化网站UI设计课程,对培养符合社会急需的全能型新媒体人才,建设理论与实践相结合更紧密的课程体系,全面提高教育质量,均具有十分重要的现实意义。

2 课程教学现状

问题式学习以问题为导向,倡导学生通过研究、讨论、协作解决问题,注重培养学生的能动性、协作性和探索实际运用的创作能力。目前个别设计类课程仍然多采用以学科知识结构为逻辑的课程设计理念和思路,且UI知识范围较广而零散,多以个人为单位完成课程作业,知识略显教条式,案例小而独立,在教学中呈现模块化,但零散的知识结构并不利于学生形成网站UI的总体产品设计理念。为培养学生解决问题的整体能力,让他们可以协作完成更大的项目任务,必须改变以知识模块结构为导向的旧式课程教学模式,以小组为单位,用问题式学习的有效课程教学模式来取而代之。

3 课程教学目标

课程的主要任务是学习网站UI的设计,设计并开发一个中小型高保真网站原型,体验网站的完整设计流程。

1)本课程的期末实践,采用四人为一组的工作室方式,分工合作,要求学生在工作室中能各自找好定位,意识到头脑风暴与团队合作的重要性,摈弃独立完成小作品的模式,去体验公司做一个产品的完整工作流程,达到训练学生的团队合作能力、与人交流的能力。

2)在综合技能的训练上,要求学生了解网站设计流程:确定网站主题—需求分析—信息架构—线框图—UI效果图—高保真原型开发。具备设计中小型网站的策划、分析、设计的能力。

4 课程优化策略

为了更好地实现课程的教学目标,笔者主要从三方面对网站UI设计课程进行优化。

课程内容的重构 单门课程的教学时段通常设置为16周,过往常见的网站设计课程的教学流程:前期按照网站设计教材的内容模块进行知识的讲解和小案例的实操,约占14周;后期让学生进行网站的整体设计,占1~2周。虽然课程的最后也是基于问题的解决,但这个问题并没有始终贯穿于课程内容中,致使课程内容与问题解决是分开的。因此,本课程的内容应始终围绕一个问题,按照网站UI的整体设计流程,即“确定网站主题—需求分析—信息架构—线框图—UI效果图—高保真原型开发”,将UI知识内容逐步分解到每周的教学环节中,突破常规的体系框架,真正实现理论和实践相结合。

教学模式的创新 采用基于问题式学习,以工作组为单位的创新教学模式,问题的解决不再基于个人,而是基于工作组的团队合作方式,以团队的力量致力于研究更大的问题,倡导的是头脑风暴式、启发探究式的教学,通过“提出问题—分析问题—解决问题”的思路来开展教学,提高综合设计能力。把学生融入有意义的问题解决过程中,强调以学生为中心,发挥他们在完成项目过程中的能动性。

考核标准的改变 传统的课程考核方式有两种:一是以个人为单位,考核个人的学习结果;二是以小组为单位,考核小组协作的学习结果。但是这两种均有利弊,即前者重视个人能力而忽略了團队协作的能力培养,后者则容易出现个别成员水平参差不齐,无法得出真正的考核效果。本课程将对考核方式进行改革,建立“个人作业+小组作品”的双重考核标准,既能体现对个人能力差异的考核,又能对工作组协作的结果进行考核。

5 课程教学实践

本次课程实践以大二的网络与新媒体专业学生为实践对象,14级网络与新媒体班共40人,分为10组。课程全部在机房上课,一人一机。课程总课时为64学时,每周4节,共16周。

在实践过程中,始终以基于问题为学习点,这个“问题”必须是一个复杂的具有挑战性的任务,而不是一个人能轻易完成的,这个任务应该是真实的或者贴近实际的,因此,各组在第二周时要确定网站选题,思考人们在生活中遇到的“痛点”和“不方便”,从人们需求性和网站可行性方面考虑,最后确定的选题如表1所示。学生始终围绕各自选题,以此为问题进行整门课的学习和协作。

教学实践分为两大部分。

1)基础学习阶段(1~4周)。该阶段主要讲解网站配色、元素设计等基础知识,并布置相应作业,课上点评,互相交流,灌输“多看优秀网页—临摹优秀网页—达到自主设计”式逐层提升设计感的思路。该阶段主要考核个人的设计能力,作业占成绩的30%。

2)问题学习阶段(5~16周)。该阶段的教学实践多为引导+讨论,将教学内容贯穿在作品进度中,边学边做,引导学生将前期所学知识运用到最后的期末作品中。四人一组,以团队的方式自主选题,共同设计一个网站。学生置于工作组中,分工合作,发挥头脑风暴的积极作用,可自行扮演设计总监、UI设计师、信息架构师、原型设计师、交互设计师等。该阶段主要考核综合设计能力和团队协作成果,作品占成绩的70%。

通过个人作业+小组作品,实现双重考核。

教学实践阶段把各组的问题引入课堂,依据“提出问题—分析问题—解决问题”的总体思路,围绕问题来设计每周的教学环节,并实时跟踪各组问题的解决进度,如表2所示。

6 实践效果分析

实践表明,网站UI设计课程采用基于问题式学习的教学模式来开展教学,把学习置于一个真实的或者贴近实际的大问题环境中,分阶段产出学习效果,既能激发学生的学习兴趣,又能增强学生学习的成就感。本课程以课堂讲授和上机实验为主,结合作品分析、小组讨论、头脑风暴、拓展练习、点评作业、演示汇报等多种教学方式,着重培养学生欣赏优秀作品和共同研究分析问题的能力。小组在自主选题时,都是从生活中寻找需求,力争设计一个能解决人们某个“痛点”的网站,做自己想做的功能,活跃学生思维的同时,也激发了学生的兴趣和比一比的斗志。

参考文献

[1]付昕.高职院校UI界面设计课程设置的构思与创想[J].科技风,2016(9):19-20.

[2]王淼.广告设计与制作专业《UI界面设计》课程教学模式改革与探索[J].艺术品鉴,2015(3):238.

[3]孟妍.PBL教学法在高职艺术设计专业教学中的应用[J].陕西青年职业学院学报,2015(1):19-22.

[4]王晓俊.PBL教学模式的构建与实践:以艺术设计专业为例[J].梧州学院学报,2016(6):89-93.

作者:蓝丽萍

第3篇:浅析工业设计与UI设计的对比

摘 要:随着信息技术的发展,电子产品的更迭速度加快,这使得UI设计的作用也就越来越明显。与工业设计产品相同,一款优秀的UI设计也会直接影响用户的使用流畅度以及使用感受。本文通过梳理UI设计的发展脉络,与现代工业设计进行比较,寻找UI设计与工业设计发展的历程的相似点,探索UI设计未来的发展方向。

关键词:UI设计;工业设计;设计思潮;规律

引言

20世纪末,图形用户界面首次出现,引发了人与微机的历史性变革。随后,微软公司推出Windows系统,将图形用户界面在个人计算机平台上得以发展;同时,直观的操作界面,使得用户体验度提高。

20世纪初的工业革命,引发了机器生产代替手工生产的大潮,产品生产也从定制化、小规模化,转变为批量化、大规模化,这同时也引起了工业化与手工技艺之间的矛盾。从约翰·拉斯金、威廉·莫里斯等人领导的“工艺美术运动”,到后来密斯·凡德罗所提出的“少即是多”的设计理念,以及日后出现的现代主义风格、后现代主义风格等等。一次一次的设计思潮,推动着工业设计的发展。反观最近兴起的UI设计,虽同为与机器相关的设计,但却缺少设计思潮的推动,而工业设计的发展规律又是否能运用在UI设计中,这对UI设计的发展又有何影响呢?这是一个值得讨论的问题。

1简述UI设计与工业设计

1.1什么是UI设计

UI,即英文User和Interface的缩写,除了包括用户和操作界面,还包括用户与界面的交互行为。因此UI设计,不仅仅要提升使用界面的美观度,还需要优化用户在使用时的舒适度,并且保证程序的流畅运行。相较于其他设计种类,UI设计是一种基于计算机系统的非实物设计,它以交互的方式,实现人和电子设备的有机互动,从而达到获取有效信息的目的。

1.2什么是工业设计

工业设计与UI设计最大的不同点是,前者的产品为实物,后者的产品则是虚拟的,因此,工业设计还要考虑生产流程、材料等因素。除此之外,两者都是以工学、美学为基础,兼备形式与功能。

如果说约翰·拉斯金、威廉·莫里斯等人领导的“工艺美术运动”是传统手工业生产向工业生产的转变标志,那么之后又提出的“形式服从于功能”则仅仅是将手工艺附属于工业产品之上,使产品在满足使用需求的条件下有特色而已。21世纪以来,人类进入信息时代,工业产品也会同手工产品一样,附属在信息类产品之上,而产品的真正功能也由具体的机械功能转为抽象的信息功能。就工业产品而言,产品的用户体验度已远远高于产品的外形,这也就是UI设计愈发重要的原因。

2工业设计与UI设计的共同点

正如前文所述,工业设计与UI设计都是以机器为基础,并以用户使用度为核心的,两者同为以科技为源动力的设计。因此,设计师在设计方法及理论知识的掌握上,两者就有相同之处,进而所产生的设计思潮应该也是能够相契合的。

2.1发源共性——新设计门类源于新生产方式

1840年,蒸汽机的发明带领人类步入蒸汽时代,批量化、大规模化的大机器生产模式迅速代替了定制化、精细化生产的手工业生产方式,这就出现了工业产品外观丑陋、缺乏个性的不足问题,批量化的产品逐渐无法满足人们的审美需求,因此,“工艺美术运动”就在英国兴起。之后又发展为“形式服从于功能”,暂时维持了审美和使用的平衡,工业设计门类也就应运而生。

进入21世纪,也就是进入了信息时代,信息技术的运用使得生产力进一步发展,而发展的步伐也更加迅猛,那么,这就预示另一种全新的设计门类即将诞生,这就是UI设计。UI设计是伴随着计算机图形操作诞生的,直至1984年,苹果公司推出MACINTOSH电脑后,界面焕然一新,交互也更加人性化,这使得这款电脑销量剧增,UI设计也就成为一项销售动力。

综上所述,工业设计与UI设计都是由新时代创造的新设计门类,而新设计门类也在极有力的作用于该时代的发展。现代社会,工业与数字化信息技术的结合缓解了其与理想化手工业结合时的矛盾,并以信息技术为基础,最大化地体现“以人为本”的设计理念,注重使用者与产品之间的交互性,同时也加速了信息的传播。

2.2生产共性——高体验度源自不断测试和革新

在工业设计中,由设计者对产品进行多次测评,得出不同的数据,进而改善产品的使用舒适度,再参照与该产品相关的设计手册,以保证产品的标准化。同样,在UI设计中,也有相关的设计手册,每当苹果公司要推出新的平台,在设计时都会参照《人机交互指南》,既保证苹果界面的统一性,又给设计师创作的空间。

综上所述,工业设计和UI设计的设计过程基本相同,都是以用户为核心,首先考虑用户的需求及交互舒适度,重视体验;再经过测评、修改,以达到用户需求为目的。设计是技术与美的结合,即使是虚拟的UI设计也需要依托实际的技术,来达到不同的效果,这也是UI设计与工业设计最明显的共同点。

3在UI设计风格变化中体现出的设计思潮

UI设计虽然到目前只有短短数十年,但已与发展近百年的工业设计有诸多相同点,在此前提下,可以推断工业设计的设计思潮与UI设计的发展也会有诸多契合点。UI设计的设计风格主要为拟物化风格和扁平化风格,而工业设计也是由早期与手工艺相结合时的相对复杂,逐渐转变为精炼,功能性也是工业设计与UI设计最显著的共性。

3.1由拟物化风格到扁平化风格的转变

3.1.1拟物化设计风格

擬物,是人对未知事物探索的初步尝试。由于对未知事物的恐惧,人们总是忠于原物,尽可能减少对其的主观判断。从象形文字,到古典主义绘画,在照相机被发明之前,写实永远是主旋律。无论思想和科技多么进步,人们依然按照这个规律进行设计。新兴的UI设计也不例外,同样是由拟物化风格逐渐发展的。

拟物化,亦是如此。每一枚图标都经过精细的绘制,有高光、阴影、过渡色等细节,甚至在交互时有逼真的音效。因此,拟物化不仅是高度模仿可观的事物,还尽可能还原使用该物品的感受。但由于拟物化风格所需空间较大,进而会影响到用户使用的流畅度,在保證识别度的前提下对拟物化风格进行改良,减少不必要的装饰。因此,UI设计的风格就逐渐转变为扁平化。

3.1.2扁平化设计风格

“‘扁平化’的概念源于现代企业管理中的扁平化管理体制,将金字塔式的组织形状‘压缩’成扁平状的组织形式,为达到灵活、敏捷、富有创造性的目标,建立更为紧凑有效的横向组织结构”。在UI设计中,扁平化风格指去高光化、去阴影化及去过渡化,将这三者去除,仅仅只留下最具辨识度的特征。

纵观整个艺术发展历程,“从欧洲文艺复兴开始,到古典主义、现实主义美术、印象主义、新艺术运动,再到20世纪的立体主义、表现主义、抽象主义、波普艺术等的出现,艺术由开始的写实风格到后来出现抽象风格,形式不断的丰富并且流派也越来越多样化,使艺术走向一个多元化的方向”。

人类螺旋式的审美进程进一步促进扁平化风格的出现。形式本身是基于人类自身的生理和心理的基本要求而产生的。复杂的装饰则会给快节奏生活的现代人带来负担,简洁的形式更便于人们接受和理解,因而扁平化风格更易适应当今社会的生活节奏。

3.2“少即是多”原则下的扁平化设计风格

扁平化设计风格,是基于瑞士国际主义平面设计原则发展而成的,也是“少即是多”设计原则的践行者。前者由于简洁的形式易于标准化的建造方式倍受战后市场的欢迎,而后者则因为简洁的形式和便捷快速的操作符合当今用户的体验。

扁平化界面看似轻描淡写,实则是對内容的凸显及元素特征的反复内化,这由繁至简的处理形式,与中国水墨写意画的表现手法有异曲同工之妙。实物化要素量的减少,意味着质的提高,表现手法的外在性降低,意味着内在力度的强化。对于“少即是多”和扁平化UI而言,形式上的简化始终不是最终目标,考虑到简化后功能上的完整度和用户体验度的提升才是核心。真正的形式产生于情感与知识的结合之中,这种此处无声胜有声的境界才是二者简洁形式下的内容,才是二者的本质。

4结语

在设计思潮中不难发现,设计风格循环往复,“功能与形式”的讨论也从未停歇,但设计的规律似乎没有什么变化。无论是发展了一百多年的工业设计,亦或是时下刚流行起来的UI设计,都在遵循着这个规律进行。

从关注形式到关心功能,從设计物到设计生活,工业设计风格从现代主义过渡到后现代主义;UI设计的风格也从拟物化过渡到扁平化。前者的变化历经了几十年,而后者只用了短短数年。设计风格的变化依然会依照此规律,但更替的时间只会越来越短。

参考文献:

[1]宋方.析“扁平化”手机界面设计[J].包装工程,2012.

[2]庞博.从扁平化风格看界面设计的发展潮流[J].装饰,2014.

作者:王梦雨 李辰瑶

第4篇:UI设计的学习心得UI设计学习方法——中鹏UI设计相关课程

UI设计的学习心得

UI设计是一个用途比较广泛的专业,很多人都搞不清楚这个专业到底都亚学些什么, UI设计在的电子界面领域应用非常广泛,行业收入也比较可观,学好UI设计意味着拥有广泛的就业前景,但是UI设计的知识面非常广,导致很多学员感到无所适从。下面我们就来从工具到理念讲起

我一直坚持这样一种看法,不管你学的是哪一种设计,其学习内容都无非包括四个部分:

1、了解专业背景知识,

2、掌握工具技能(如:如何学会绘图、使用相关设计软件等)、

3、商业运作规则的了解,

4、审美能力的建构艺术理念的习得。

一般的UI设计都会涉及的内容有:素描、UI手绘、UI色彩、三大构成、创意设计、设计心理、PS基础、PS提高、illustrator、Flash、After Effects、设计规范、GUI基础课程、创意设计、综合理论与实践、静态网页构建、前端程序开发、动态网站简介和应用、UX理论、AXURE-RP6.5、iphone/Android、手机交互等,涉及的应用领域不可谓不多,因此要想全部掌握或者眉毛胡子一把抓是不太明智的,下面我梳理出一些概要的学习方法,仅供大家参考。

第一:学习工具

工具是第一位的。 一般对于入门阶段的人来说,你就不要老是纠结怎么学。先玩透Photoshop,UI设计的工作中最主要的工具就是PS,比方在做一些图标和界面的时候,PS都是必不可少的。

但是Photoshop有那么多功能需要每一个都学吗?当然不用,这个后面我们专门找一节慢慢说,在UI设计中ps主要学习也就那几个工具。

第二:学习UI设计规范

规范就是要刻意练习,规范这个主要还是要练习,没有太多捷径可走。

第三:基本的色彩学习

色彩的三要素指的就是色相、明度和纯度。这三个分别是什么意思呢?我们可以这样理解:

1、理解什么是色相

色相指色彩的相貌,不同的波长决定不同的色相,这是大家最直观感受到的色彩。色相对于色彩是最直接的代表,是色彩的灵魂。

大家大家都知道在光谱中,红、橙、黄、绿、蓝、紫等由于有着不同的波长,带给我们不同的色彩感受,它们是最基本的色相,其他诸如象牙白、柠檬黄等都是指色彩特定的色相,是人们对不同色相的不同称谓。有一个地方要注意,黑色和白色是无色相的。

2、理解明度

明度指色彩的明暗程度。明度可以说是色彩的骨架,明度对色彩的结构起着关键性的作用。明度具有定的独立性,它可以离开色相和纯度单独存在,而色彩的色相和纯度总是伴随着明度一起出现的,所以明度是色彩的骨架。

通俗点解释就是通过色相的加白加黑的一个变化,任何色彩都存在明暗变化的,从明度光谱上可以看到最明亮的颜色是黄色,处于光谱的中心位置。最暗的是紫色,处于光谱的边缘。

3、理解纯度

纯度指色彩的鲜艳程度,就是色彩的饱和度、纯净度、彩度。直观理解就是指色彩的鲜浊程度。纯度最高的色彩就是原色,随着纯度的降低,色彩就会变的暗、淡。纯度降到最低就是失去色相,变为无彩色,也就是黑色、白色和灰色。

4、学会UI设计中色彩的使用

那么在UI设计过程中色彩该如何去搭配?主要通过4部分来讲解。在UI界面设计比例中:用色一般分为主色,次色和辅助色,它们的比例是按照20%-30%、5%-10%和5%来进行配色,通过不同的配色比例让界面看起来不会出现突兀或者是主次不分的情况。

5、进入临摹阶段

了解了具体的知识,最主要的就是练习了,学习技法主要是侧重过程,在练习书法时,最好是临和摹结合起来,各扬其长,各避其短。此外,还要经常读帖,仔细观察、分析、体会,可以边读边用手“空临”。只要功夫下得多了,读帖和写字的能力自然会增强,对书法美也体会得更深了。需要联系临摹来加强你的技巧,此外,为保存、修复、展览、出售而取得复制品,侧重的是临摹的结果。因此,临摹品有商品性质。它流传于世又产生了伪作和赝作等复杂问题。在世界各国,临摹一直是学习古典书法或绘画技法,借鉴和继承优秀传统的主要途径与手段不要想着怎么做,怎么临摹,学啊~直接打开ps就开始操作,如果不知道怎么临摹,可以多加几个大神群去问。 这个阶段的就是要:多练和多问

6、学会切图

之所以需要切图是因为用户手中看到的产品界面,并非设计师呕心沥血创作的效果图,而是一个个单独的切图经由开发同学技术实现。

切图作为设计师与开发者之间的桥梁,它的作用很关键,合适的切图、精准的位置可以最大限度的还原效果图的设计,精妙的切图更会有事半功倍的效果哦!

好了,大概这几点,当然这个只是学习UI设计的中的其中一小部分,也是入门的阶级。如果你觉得有用,就是今天这一篇最大的目的。

7、习得扁平化思维

扁平化实质就是简约风格,这种美学的哲学内涵就是:少即是多

扁平化的概念最核心的地方就是:去掉冗余的装饰效果,意思是去掉多余的透视,纹理,渐变等等能做出3D效果的元素。让"信息"本身重新作为核心被凸显出来。并且在设计元素上强调抽象、极简、符号化。扁平化尤其在手机上,更少的按钮和选项使得界面干净整齐,使用起来格外简洁。可以更加简单直接的将信息和事物的工作方式展示出来,减少认知障碍的产生。

也就是说做扁平化设计是在做减法,不像之前的拟物化,要考虑到诸多的质感、光影等细腻的地方。所以对于手绘功底不强的设计师来说,只要了解造型和透视关系,对于扁平化图标绘制就没有问题。界面过于单调,容易审美疲劳。扁平化设计限制了可采用的元素——

比方说其中就没有纹理——同时也就限制了内容的表现形式。更何况扁平化的GUI基本都是大色块堆叠出来,对于设计与制作业提高了不止一倍两倍的工作效率

8、UI经典设计的借鉴能力

借鉴本身就是创新的一部分,创新的本质就是嫁接和组合,好的UI设计作品非常之多,学活借鉴,有效的、高明的借鉴就会快人一步。

文章来源:中鹏教育http://kc.gdzp.org

第5篇:UI设计的学习心得

想做一个好的UI设计师除了应该具有一定的审美能力,还要了解整个产品的开发过程,因为目前国内的软件行业还不能对UI设计形成应有的重视程度,所以对我们的要求就更高了,你要能作出夺人眼球的东西,还要站在用户的角度充分了解他们的需求和使用习惯,因为一般的软件公司的UI设计师只有一个或者几个也都是孤军奋战,而且经常会碰见没有经验的team leader,不懂得协调你和其他团队成员的工作,所以你还要与团队成员充分沟通,来获得设计中所需要的基本信息,要有耐心有好脾气„„ 做界面设计的工具一般有photoshorp、Illustrator/FreeHand/CorelDraw/c4d/3dmax(至少一个)、Dreamweaver、Flash、Html;编程方面最好能跟程序员同步,懂一点ASP、JSP等软件开发语言、还有开发环境、服务器种类„„ 还要耐的住寂寞,漫长的项目开发过程中,你的工作可能只是前期,到了后面可能会有很多的空闲时间,用来学习充电是不错的选择。

其实学习ui设计是一个比较漫长枯燥的阶段,要学习的东西真的很多,如果你缺少耐心的话可能这个知识你怎么都学不到手,在学些的过程中小编提醒大家一定要注意以下几点:

第一、时刻保持学习状态与学习主动性。

学习的机会很多,无论是在生活里,你结识一个朋友、看一场电影、读一本书、浏览一个网站、看一则广告,随处都暗藏着学习的机会,虽然不一定能学到具体的技能,但至少可以领略到一些精神和获得一些专业上的灵感。

第二、一定要坚持不懈的练习!

设计、编程在我眼里都是需要动手才能练就出来的本事,只看书满脑子理论完全不行。设计基本功:你可以有计划的练习手绘,提高painting能力我认为对做设计,包括ui设计,是有好处的。从临摹开始:可以先临摹一些教材上的范例,现有的优秀界面,优秀设计师的作品;在此基础上,时不时可以加上自己的想法情感,搞点原创。总之,“曲不离口拳不离手”要坚持练习,多动手,一定会从中获得很多经验!

三、基础理论和基本技能不能忽视

许多设计都有着自己的规范与知识点,这些你可以自己找书看,各种设计专业的书籍可以具体从构图、排版、色彩、图形等方面入手了解一些基础知识。然后学习UI设计常用的软件,Adobe系列的 Photoshop、Illiustrator算常用的了,如果对web感兴趣还可以玩玩Flash,Dreamweaver甚至是html5 等等

第四、前期创作建议从不断模仿做起

江西新华电脑学院 怎样才能学好UI设计?在刚开始学的时候,大部分人都是从不断模仿学起,孰能生巧,通过不断得积累,最终你会学到UI的精髓。当然,你的模仿对象要有水准,要选择那些经典的作品。

第五、多洞察别人的作品,多阅读,多思考

互联网是一个日新月异的行业,我们建议学员,在日后的界面设计工作中,不可盲目的追赶潮流,要知道,设计是需要一段时间的沉淀才能达到一个新高度。多洞察别人的作品,多阅读,多思考,这样你才能成为一名优秀的UI交互设计师。

写的比较多,也比较乱,但都是我在学习过程中的一些总结,也许能给新入门的朋友们带来一些帮助,少走一些弯路吧,最后祝愿大家学有所成,都能顺利找到UI设计师的工作。

江西新华电脑学院

第6篇:成都UI设计培训学校哪家好?学习ui设计的意义是什么

国信安教育基地

成都UI设计培训学校哪家好?学习ui设计的意义是什么

成都国信安UI设计培训由副教学总监,优秀讲师带队并亲自授课,秉承成都国信安一贯的专业品质态度,在课程质量,学生素质,就业服务上相当严格要求,并以学业满意就业为目标,打造国内优秀UI设计培训班,感兴趣的同学不妨关注国信安教育基地了解一下吧。

中国每年有大量的计算机类毕业生进入企业,企业会把那些程序员列入优秀人才加以重视呢?斩获高薪的程序员需要哪些素质呢?

规范化、标准化的代码编写习惯

作为一些外国知名软件公司的规矩,代码的变量命名,代码内注释格式,甚至嵌套中行缩进的长度和函数间的空行数字都有明确规定,良好的编写习惯,不但有助于代码的移植和 纠错,也有助于不同技术人员之间的协作. 有些代码发烧友叫嚣高水平程序员写的代码旁人从来看不懂,这种叫嚣只能证明他们自己压根不配自称程序员,代码具有良好的可读性,是程序员基本的素质需求。再看看整个Linux的搭建,没有规范化和标准化的代码习惯,全球的研发协作是绝对不可 想象的。

需求理解能力

程序员需要理解一个模块的需求,很多小朋友写程序往往只关注一个功能需求,他们把性能指标全部归结到硬件,操作系统和开发环境上,忽视了本身代码的性能考虑,有人曾经放言说写一个广告交换程序很简单,这种人从来不知道在百万甚至千万数量级的访问情 况下的性能指标是如何实现的。对于这样的程序员,你给他深蓝那套系统,他也做不出太 极链的并访能力。性能需求指标中,稳定性,并访支撑能力以及安全性都很重要,作为程 序员需要评估该模块在系统运营中所处的环境,将要受到的负荷压力以及各种潜在的危险 和恶意攻击的可能性,就这一点,一个成熟的程序员至少需要2到3年的项目研发和跟踪经 验才有可能有心得。

四川地处中国大西南,肥沃的土地,丰富的自然资源,悠久的历史和绚烂多彩的少数民族文化,构成了多样性的自然和文化旅游资源。有的同学因高考落榜而黯然神伤,不知道出路在哪里?首先需要说明,高考落榜是个普遍问 国信安教育基地

题,读大学不是人生的唯一出路,条条大道通罗马,不上普通大学人生更很精彩。君不见,大学生就业形势严峻,大学生毕业即失业。一边是大学生求职难,一方面是企业技能人才用人荒,此现象可谓冰火两重天。许多人观念正在悄然转变,读大学不如学技术。学习的目的是就业,有个美好未来。作为高薪行业,IT行业一直是年轻人求职的首选。互联网行业以其超过百万的人才缺口和长效的职业发展期而倍受青睐。未来人们对互联网的运用需求仍将持续不断上升。因而,对于那些对互联网新兴事物感兴趣的学生而言,选择IT行业,是绝佳的选择。

寻寻觅觅,走马观花,你在IT培训这条路上看了多久?走了多远?你是否还在为它而困扰?你是否发现找到一个心仪的实在太麻烦!其实选择也可以很简单!让小编带你走进IT培训,来了解些实用干货。接下来就让小编带你来看看IT培训相关的情况吧~请看下文~ 国信安教育基地

读书的时候,家长都教育孩子要好好学习,只有如此才能考上好的大学。成年后,大家愈发认识到了学习的重要性,纷纷开始谋求第二职业,目的是多赚外快,也希望成就新的职业履历。成都ui设计那个培训班好?国信安教育基地就是一个很专业的培训机构,国信安教育基地的老师对学员都十分的认真负责,对于想学习ui设计的你,一定不能错过。

ui设计强调的是用户与界面之间的交互关系,因此它十分考验ui设计师的技术实力,如果技术水准太差,就无法给予用户好的体验,公司自然不会开出高工资。那如何才能学到精华增长自己的技术水平呢?首先要做的就是要选择好的学校和优质的老师,于是知道成都ui设计那个培训班好就变得十分重要了。 国信安教育基地

目前市面上的培训机构聆郎满目,人们在选择过程中总会迷茫。有的机构规模大,老师多,有的机构采取小班教学服务档次高,我们该如何选择?其实最根本的还是要看自己适合什么类型。建议大家不要盲目的根据规模大小选择学校,因为有的学校虽然刚成立,但却在师资上投入了极大的花费和精力,只为塑造优良的教学品牌,那么这类学校也是值得选择的。

成都ui设计那个培训班好?知道选择规则后,便于大家认真思索和对比。许多学校各有千秋,关键就看哪些老师适合自己,哪些老师讲授的知识更加详细。比如对于基础班的学生而言,选择那些更注重理论细节的老师比较合适。

国信安IT培训基地专注java培训、php培训、UI设计培训、软件测试培训、大数据培训、web前端培训等培训课程。你们准备好怎么学习IT技术了吗?来参加国信安IT培训课程,你的选择不会有错!

第7篇:UI设计:绘制一套精美线性图标的方法!

作者: 一网学 最后更新时间:2015-10-21 10:52:09 小编:图标设计是UI设计的基础入门阶段,那么如何绘制一套完整的线性UI图标呢。今天这篇教程分享UI图标设计的流程和思路吧,有兴趣的同学快来学吧。

作者:阿里MUX-子绩 推荐阅读:

职业岗位不清楚?设计师详细职位分工指南 游戏设计:传奇游戏纪念碑谷背后的设计秘密 ui利器:在手机上快速预览应用图标的ICNS

【一网学 原创文章 投稿邮箱:2513515697@qq.com】

点击:7关键字: ui设计

线性图标

ui教程

第8篇:UI设计学习教程内含学习技巧(学UI的必看)

免费试学/ 一对一辅导/项目实训/就业保障 UI设计学习教程内含学习技巧(学UI的必看)

UI设计越来越火,很多朋友在问UI设计要学什么?【UI设计需要学什么?>>】

怎么学?关于UI设计的学习,常常会听到这么一些忠告“多看 多想 多做”,但作为新人更想知道咋看、咋想、咋做。下面泛艺学苑老师为大家总结了几个学习UI设计的小技巧【UI入门到精通教程>>】,希望对新人有所帮助。

学习ui设计的小技巧之一:软件学习

ui设计要学的东西很多,软件是基础的东西,要想做好出好的ui设计就得先熟练掌握ui设计的基础软件,软件方面有:PS、 AI、ID、Firework 、Dreamweaver、 HTML

5、div+css等等,不过对于新人,一定要先把Photoshop学扎实。Ui设计要学的都是比较高级的知识,学习起来也是需要花时间和精力的,所以呢,基础软件一定要先学扎实。 学习ui设计的小技巧之二:找灵感

如何找灵感,也就是培养审美的能力,首先我们要知道什么好看,什么不好看。当我们排斥那些不好看的设计的时候,我们的品味就自然上升了。

再就是要知道去什么网站上看设计作品。看到不错的设计要采集下来。说到这里,我给大家推荐一些不错的网站。如:花瓣网、站酷、UI中国、Behance、APP截图欣赏网等等……

那么,如何能快速找到灵感呢,当我们接到一个设计任务的时候,该如何去快速的执行,快速找到灵感呢。

平时的素材采集和分类至关重要。一定要整理分好自己的素材文件夹。这对于一个设计来说,真的非常非常重要。

设计师的素材资源库,就是自己的财富,只有自己整理出来的才有价值。关键是自己要记得东西放在哪里了,不要用的时候找不到了~ 免费试学/ 一对一辅导/项目实训/就业保障

学习ui设计的小技巧之三:懂分析

学会分析好的设计作品,主要从下面的几个方面去分析: 1.是配色上吸引了我们的眼球 还是 版式设计吸引了我们的眼球? 2.细节处理的很有新意吗? 3.背景烘托的很有档次吗? 4.为什么排版上看着很舒服?

然后再换位思考一下,如果是自己,自己会如何设计,设计手法和细节的处理会不会?创意想法上有没有给带来些什么灵感... 学习ui设计的小技巧之四:做笔记

有没有发现一个问题,我们每天都在看各种设计作品,真到自己做的时候,一下子全都忘记了,脑子短路了。之前看到那么多好的设计作品也都白看了,人家的还是人家的,跟自己一点关系也没有。

所以我建议准备一个小本子,养成做笔记的习惯,坚持完成下面三点: 1. 看到了什么好设计画一画。 2. 想到了什么好点子,写一写。

3. 做会了什么或是想要学点什么,都记录下来。

那么半年时间下来,小本子就写的密密麻麻了,没事拿出来翻翻看,学习的时候积累的心得,精益求精。

以上就是学习ui设计的小技巧了,只要用心认真学习,我相信一定可以成为一名优秀的ui设计师。 免费试学/ 一对一辅导/项目实训/就业保障

泛艺学苑致力于UI设计高端人才培养,泛艺采用先进的在线教学模式,非一线城市的学生也能享受一流师资;采用国内一流的动态学习系统,能真正做到针对每个学员情况的特色学习计划,保证成才;对教学品质的严格把控保障了泛艺毕业学员除工作习惯良好外,具备外面2~3年一线企业的设计师工作经验,能保障学生进入企业迅速上手,学生效率是其他机构的2倍以上。【了解课程详情>>】

第9篇:UI设计中的字体设计规范

去名企 拿高薪 到翡翠教育

UI设计中的字体设计规范

很多刚做APP界面的设计师,经常会因为字号,字体颜色,间距而困扰。 拿到设计需求后,开始进行设计,不知道从何去调整界面的字号和行间距等。容易碰到的问题是页面和页面的字号调着调着就大小或颜色不统一了。并且容易导致设计稿反复得修改。设计出来的效果图文字左右间距层次不齐,导致与预期不符等。

在实践的过程中我们会慢慢发现一些规律或者经验规范。接下来翡翠教育柳州墨本校区的老师将和大家一起聊聊在界面设计中的那些常规字体的使用规范。

不明确而繁琐的字体搭配会导致整个画面失调。可以这样说,字体可以成就设计也可以毁掉设计。

问题的关键有:

1.字体样式太多,导致页面杂乱 2.使用的字体不易识别

3.字体样式和内容的气氛或规范不匹配 怎么避免这样的结果发生呢?

通过设计经验可以帮助你做出更好的版式,翡翠教育柳州墨本校区的老师都拥有丰富的从业经验,了解不同平台的常用字体设计规范,帮助学生快速的掌握规范。

在每个项目设计中只使用1-2个字体样式,而在品牌字有明确的规范的情况下,只需要一种字体贯穿全文,通过对字体放大来强调重点文案。字体用的太多,越显得不够专业。

不同的样式的字体,形状或系列最好相同,保证字体风格的一致性。 字体与背景的层次要分明,确保字体样式与色调气氛相匹配

在不同平台的界面设计中规范的字体会有不同,像移动界面的设计就会有固定的字体样式。网页中会有常用的几个字体,在这我和大家分别介绍一下。

以下是在72像素/英寸下的规范 移动端常规字体

IOS:常选择华文黑体或者冬青黑体,尤其是冬青黑体效果最好。 去名企 拿高薪 到翡翠教育

Android

英文字体:Roboto 中文字体:Noto 移动端常用的的字号有哪些呢? 导航主标题字号:40-42px 在内文展示中字号大小又是多大呢?

大的正文字号32px,副文是26px,小字20px,在内文的使用中,根据不同

类型的App会有所区别。

像新闻类的APP或文字阅读类的APP更注重文本的阅读便捷性,正文字号36px,会选择性的加粗。

大家注意了,在选用字体大小的时候一定要选择偶数的字号,因为在开发界面的时候,字号大小换算是要除以二的。这个详细缘由大家可以网上查询,我就不在这一一的介绍了。大家感兴趣的欢迎前来翡翠教育柳州墨本校区咨询了解。

上一篇:合作社发展目标下一篇:物业突发事件应急处理