JavaRush /Java 博客 /Random-ZH /UX 和 UI 设计师做什么,前端开发人员做什么?

UX 和 UI 设计师做什么,前端开发人员做什么?

已在 Random-ZH 群组中发布
IT行业有相当多与设计相关的领域。其中最常见的是设计师,隐藏在缩写 UX 和 UI 后面。嗯,有些人甚至设法让前端开发人员成为设计师。让我们试着弄清楚IT界的设计师是谁,UI和UX有什么区别,前端工程师与设计有什么关系。 UX 和 UI 设计师做什么,前端开发人员做什么? - 1

设计师

开发应用程序、网站或游戏的界面是一个相当复杂的过程,需要应用不同领域的知识:工程、心理学和设计。用户界面设计者(英文-用户界面或UI)关注网站功能的显示方式(搜索、选项卡、菜单)以及客户端和界面之间交互的细节。UI 设计师的目标是审美上可接受的现代产品设计。UX代表User Experience,意思是“用户体验”。用户体验设计师更关注潜在用户对界面的可用性和理解。这样的专家通常会进行研究和调查,为创建设计概念奠定基础,并在开发期间和之后测试概念。它通常关注结构、内容、导航以及用户如何与这些元素交互。
UX 和 UI 设计师做什么,前端开发人员做什么? - 2
它生成站点地图、原型,这是创建软件时的基本结构。用户体验设计师的工作目标是让用户快速、轻松地从网站上获得他来这里的目的。然而,今天这两个专业用斜线书写是很常见的。也就是说,两个方向的任务均由一名专家执行。UX/UI 设计师设计用户与界面的交互,决定用户到底需要做什么,并负责界面的最终外观。

UX/UI 设计师需要了解什么

  • 图形编辑器。市场上最流行的工具是 Adob​​e Photoshop、Adobe Illustrator,以及 Sketch、Figma。选择一个对您来说方便的编辑器,然后首先尝试绘制网站或应用程序的屏幕截图,使它们稍微现代化一些。

    素描指南

  • 原型设计工具(Mockplus、Axure)。原型设计工具是想法与其实现之间的联系。使用什么工具并不重要。您可以尝试多种,然后决定适合您的风格和喜好的一种。

  • 用户心理。在设计阶段,您应该考虑您或其他人使用此界面是否方便。设身处地为客户着想,与他建立牢固的联系并关注他的需求。毕竟,只要有需求,产品就会成功。

    设计心理学:设计时有用的 8 条心理学原则

  • 您还需要色彩理论知识。我们从小就知道一些事情,尤其是那些上过艺术学校的人。然而,设计师的工作有一些具体细节。基础知识可以从书籍或互联网上的文章中获得。

    设计师色彩理论第 1 部分:色彩含义

    UI设计中如何运用色彩

  • 建议了解排版,这是一种结合文本和视觉组件的方法。

    初学者设计师的 25 条版式规则

    网络上的版式

  • 网站的组成和可用性。

    网页设计中的构图,或者 Photoshop 教程中没有提及的内容

  • 根据工作的具体情况,您可能需要了解 HTML 和 CSS 或(某些)编程语言(可以在下面的“前端开发人员应该了解什么”部分中找到资源链接)。

UX 和 UI 设计师做什么,前端开发人员做什么? - 3

前端开发人员

前端开发人员的主要任务是开发界面的客户端部分。也就是说,这样的专家使设计师的设计“焕发了活力”。他负责界面的操作和操作,较少负责视觉内容。前端开发人员在开发阶段经常需要为用户界面找到一个好的解决方案,因此他经常与UX/UI设计师合作。前端开发人员编写的代码在用户的浏览器中运行(正如他们所说,“在客户端”)。此外,最重要的任务之一是确保网站或 Web 应用程序在所有平台和浏览器上看起来都相同。

前端开发人员应该了解什么

一般来说,前端基于三个支柱:HTML 页面标记语言、CSS 样式表和 JavaScript 编程语言。另外,前端开发人员必须了解HTTP协议、服务器和浏览器的运行原理,以及目前市面上的各种设备上显示界面的特点。创建 Web 界面的工具和方法在不断发展和变化,因此开发人员必须不断监控这一点。
UX 和 UI 设计师做什么,前端开发人员做什么? - 4

HTML 和 CSS(布局)

这就是布局,就是建造场地的砖块。HTML 标记语言规定了站点的组织、内容以及它们之间的所有交互。它允许您指定页面的顶部、底部、侧边块的内容、标题、文本显示和多媒体元素。CSS 样式表用于装饰 HTML 元素。它们准确地确定页面上每个图形元素的显示方式。使用最新版本的 HTML5 和 CSS3,您可以在页面上放置视频和音频组件、创建 2D 图像和动画,甚至编写简单的游戏。无需尝试一次记住所有标签和样式。学习基础知识并立即付诸实践将会很有帮助。W3School 是一个非常好的网站,您可以在其中学习 HTML 和 CSS 的基础知识。但前提是您至少具备基本的英语知识。 此外,前端开发人员必须了解跨浏览器和跨平台开发、自适应和响应式布局。

引导程序

它是 HTML、CSS 和 JavaScript 的框架。也就是说,使用某些模板(例如构造函数),您可以比没有它们更快地组装站点。但是,当然,您需要自己定制它以满足您的需求。如果您懂英语,我们推荐getbootstrap网站和相同的w3schools

JavaScript

Javascript是前端开发的核心。这是第一种也是最广泛使用的接口编程语言。它可以为网站添加很多功能。在基本层面上,这种语言允许您向页面添加交互式元素。它用于创建实时更新的地图、互动在线游戏和电影。在我们的 JavaRush 高级课程中,我们学习了一些 JavaScript。您还可以在同一个W3School学习它或在网站javascript.ru上阅读俄语版本。
UX 和 UI 设计师做什么,前端开发人员做什么? - 5

jQuery

jQuery 是一个 Javascript 库,其中包含插件和扩展,可以使开发变得更加容易和更快。库允许您添加现成的组件,然后可以针对特定项目进行自定义,而不是从头开始编写代码。您可以使用自动填充搜索表单、重新排列和调整网格大小以及设置倒计时器等功能。 w3school 的 jQuery 实践课程

JavaScript 框架

框架有多种类型,但您可以选择一种方便您使用的框架。最著名的是 Angular、Backbone、Ember 和 React。它们代表了现成的代码结构。它们有助于加快开发速度。与库相结合,它们可以最大限度地减少从头开始开发网站或应用程序。 2017 年 5 个最流行的 JavaScript 框架和库回顾

Git版本控制系统

版本控制系统可以跟踪一段时间内对代码所做的更改。它们还允许您返回到项目的先前版本。Git 是使用最广泛的版本控制系统。了解如何使用 Git 是每个开发人员的一项重要技能。 Git 俄语教程
UX 和 UI 设计师做什么,前端开发人员做什么? - 6

简要结论

UI是User Interface的缩写,意思是“用户界面”。也就是说,UI 设计师主要负责如何将产品呈现给用户。他开发按钮、图标、选择字体并准备布局。UX 代表用户体验。因此,用户体验设计师设计网站、应用程序或任何东西的设计,以便用户感到舒适且易于理解,并且他可以以最小的努力从网站获得他需要的东西。通常,这两种类型的工作都是由一个人执行的:UI/UX 设计师。前端开发人员通过引入动态来使设计师的工作变得活跃起来:按钮开始被按下,图片开始发生变化。他必须了解编程语言,熟悉框架、预处理器和库。
评论
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION