首页

http的状态码（中英文）

seo达人

 1**：请求收到，继续处理

2**：操作成功收到，分析、接受

3**：完成此请求必须进一步处理

4**：请求包含一个错误语法或不能完成

5**：服务器执行一个完全有效请求失败

100——客户必须继续发出请求

101——客户要求服务器根据请求转换HTTP协议版本

200——交易成功

201——提示知道新文件的URL

202——接受和处理、但处理未完成

203——返回信息不确定或不完整

204——请求收到，但返回信息为空

205——服务器完成了请求，用户代理必须复位当前已经浏览过的文件

206——服务器已经完成了部分用户的GET请求

300——请求的资源可在多处得到

301——删除请求数据

302——在其他地址发现了请求数据

303——建议客户访问其他URL或访问方式

304——客户端已经执行了GET，但文件未变化

305——请求的资源必须从服务器指定的地址得到

306——前一版本HTTP中使用的代码，现行版本中不再使用

307——申明请求的资源临时性删除

400——错误请求，如语法错误

401——请求授权失败

402——保留有效ChargeTo头响应

403——请求不允许

404——没有发现文件、查询或URl

405——用户在Request-Line字段定义的方法不允许

406——根据用户发送的Accept拖，请求资源不可访问

407——类似401，用户必须首先在代理服务器上得到授权

408——客户端没有在用户指定的饿时间内完成请求

409——对当前资源状态，请求不能完成

410——服务器上不再有此资源且无进一步的参考地址

411——服务器拒绝用户定义的Content-Length属性请求

412——一个或多个请求头字段在当前请求中错误

413——请求的资源大于服务器允许的大小

414——请求的资源URL长于服务器允许的长度

415——请求资源不支持请求项目格式

416——请求中包含Range请求头字段，在当前请求资源范围内没有range指示值，请求

也不包含If-Range请求头字段

417——服务器不满足请求Expect头字段指定的期望值，如果是代理服务器，可能是下

一级服务器不能满足请求

500——服务器产生内部错误

501——服务器不支持请求的函数

502——服务器暂时不可用，有时是为了防止发生系统过载

503——服务器过载或暂停维修

504——关口过载，服务器使用另一个关口或服务来响应用户，等待时间设定值较长

505——服务器不支持或拒绝支请求头中指定的HTTP版本

==========================================================

英文版：

100：Continue

101：Switching Protocols

102：Processing

200：OK

201：Created

202：Accepted

203：Non-Authoriative Information

204：No Content

205：Reset Content

206：Partial Content

207：Multi-Status

300：Multiple Choices

301：Moved Permanently

302：Found

303：See Other

304：Not Modified

305：Use Proxy

306：(Unused)

307：Temporary Redirect

400：Bad Request

401：Unauthorized

402：Payment Granted

403：Forbidden

404：File Not Found

405：Method Not Allowed

406：Not Acceptable

407：Proxy Authentication Required

408：Request Time-out

409：Conflict

410：Gone

411：Length Required

412：Precondition Failed

413：Request Entity Too Large

414：Request-URI Too Large

415：Unsupported Media Type

416：Requested range not satisfiable

417：Expectation Failed

422：Unprocessable Entity

423：Locked

424：Failed Dependency

500：Internal Server Error

501：Not Implemented

502：Bad Gateway

503：Service Unavailable

504：Gateway Timeout

505：HTTP Version Not Supported

507：Insufficient Storage

完整的 HTTP 1.1规范说明书来自于RFC 2616，你可以在rfc-editor在线查阅。HTTP 1.1的状态码被标记为新特性，因为许多浏览器只支持 HTTP 1.0。你应只把状态码发送给支持 HTTP 1.1的客户端，支持协议版本可以通过调用request.getRequestProtocol来检查。

本部分余下的内容会详细地介绍 HTTP 1.1中的状态码。这些状态码被分为五大类：

100-199 用于指定客户端应相应的某些动作。

200-299 用于表示请求成功。

300-399 用于已经移动的文件并且常被包含在定位头信息中指定新的地址信息。

400-499 用于指出客户端的错误。

500-599 用于支持服务器错误。

HttpServletResponse中的常量代表关联不同标准消息的状态码。在servlet程序中，你会更多地用到这些常量的标识来使用状态码。例如：你一般会使用response.setStatus(response.SC_NO_CONTENT)而不是 response.setStatus(204)，因为后者不易理解而且容易导致错误。但是，你应当注意到服务器允许对消息轻微的改变，而客户端只注意状态码的数字值。所以服务器可能只返回 HTTP/1.1 200 而不是 HTTP/1.1 200 OK。

100 (Continue/继续)

如果服务器收到头信息中带有100-continue的请求，这是指客户端询问是否可以在后续的请求中发送附件。在这种情况下，服务器用100(SC_CONTINUE)允许客户端继续或用417 (Expectation Failed)告诉客户端不同意接受附件。这个状态码是 HTTP 1.1中新加入的。

101 (Switching Protocols/转换协议)

101 (SC_SWITCHING_PROTOCOLS)状态码是指服务器将按照其上的头信息变为一个不同的协议。这是 HTTP 1.1中新加入的。

200 (OK/正常)

200 (SC_OK)的意思是一切正常。一般用于相应GET和POST请求。这个状态码对servlet是缺省的;如果没有调用setStatus方法的话，就会得到200。

201 (Created/已创建)

201 (SC_CREATED)表示服务器在请求的响应中建立了新文档;应在定位头信息中给出它的URL。

202 (Accepted/接受)

202 (SC_ACCEPTED)告诉客户端请求正在被执行，但还没有处理完。

203 (Non-Authoritative Information/非官方信息)

状态码203 (SC_NON_AUTHORITATIVE_INFORMATION)是表示文档被正常的返回，但是由于正在使用的是文档副本所以某些响应头信息可能不正确。这是 HTTP 1.1中新加入的。

204 (No Content/无内容)

在并没有新文档的情况下，204 (SC_NO_CONTENT)确保浏览器继续显示先前的文档。这各状态码对于用户周期性的重载某一页非常有用，并且你可以确定先前的页面是否已经更新。例如，某个servlet可能作如下操作：

int pageVersion =Integer.parseInt(request.getParameter("pageVersion"));

if (pageVersion >;= currentVersion) {

response.setStatus(response.SC_NO_CONTENT);

} else {

// Create regular page

}

但是，这种方法对通过刷新响应头信息或等价的HTML标记自动重载的页面起作用，因为它会返回一个204状态码停止以后的重载。但基于JavaScript脚本的自动重载在这种情况下仍然需要能够起作用。可以阅读本书7.2 ( HTTP 1.1 Response Headers and Their Meaning/HTTP 1.1响应头信息以及他们的意义)部分的详细讨论。

205 (Reset Content/重置内容)

重置内容205 (SC_RESET_CONTENT)的意思是虽然没有新文档但浏览器要重置文档显示。这个状态码用于强迫浏览器清除表单域。这是 HTTP 1.1中新加入的。

206 (Partial Content/局部内容)

206 (SC_PARTIAL_CONTENT)是在服务器完成了一个包含Range头信息的局部请求时被发送的。这是 HTTP 1.1中新加入的。

300 (Multiple Choices/多重选择)

300 (SC_MULTIPLE_CHOICES)表示被请求的文档可以在多个地方找到，并将在返回的文档中列出来。如果服务器有首选设置，首选项将会被列于定位响应头信息中。

301 (Moved Permanently)

301 (SC_MOVED_PERMANENTLY)状态是指所请求的文档在别的地方;文档新的URL会在定位响应头信息中给出。浏览器会自动连接到新的URL。

302 (Found/找到)

与301有些类似，只是定位头信息中所给的URL应被理解为临时交换地址而不是永久的。注意：在 HTTP 1.0中，消息是临时移动(Moved Temporarily)的而不是被找到，因此HttpServletResponse中的常量是SC_MOVED_TEMPORARILY不是我们以为的SC_FOUND。

注意

代表状态码302的常量是SC_MOVED_TEMPORARILY而不是SC_FOUND。

状态码302是非常有用的因为浏览器自动连接在定为响应头信息中给出的新URL。这非常有用，而且为此有一个专门的方法——sendRedirect。使用response.sendRedirect(url)比调用response.setStatus(response.SC_MOVED_TEMPORARILY)和response.setHeader("Location", url)多几个好处。首先，response.sendRedirect(url)方法明显要简单和容易。第二，servlet自动建立一页保存这一连接以提供给那些不能自动转向的浏览器显示。最后，在servlet 2.2版本(J2EE中的版本)中，sendRedirect能够处理相对路径，自动转换为绝对路径。但是你只能在2.1版本中使用绝对路径。

如果你将用户转向到站点的另一页中，你要用 HttpServletResponse 中的 encodeURL 方法传送URL。这么做可预防不断使用基于URL重写的会话跟踪的情况。URL重写是一种在你的网站跟踪不使用 cookies 的用户的方法。这是通过在每一个URL尾部附加路径信息实现的，但是 servlet 会话跟踪API会自动的注意这些细节。会话跟踪在第九章讨论，并且养成使用 encodeURL 的习惯会使以后添加会话跟踪的功能更容易很多。

核心技巧

如果你将用户转向到你的站点的其他页面，用 response.sendRedirect(response.encodeURL(url)) 的方式事先计划好会话跟踪(session tracking)要比只是调用 response.sendRedirect(url) 好的多。

这个状态码有时可以与301交换使用。例如，如果你错误的访问了某路径信息不完整)，有些服务器就会回复301状态码而有些则回复302。从技术上说，如果最初的请求是GET浏览器只是被假定自动转向。如果想了解更多细节，请看状态码307的讨论。

303 (See Other/参见其他信息)

这个状态码和 301、302 相似，只是如果最初的请求是 POST，那么新文档(在定位头信息中给出)药用 GET 找回。这个状态码是新加入 HTTP 1.1中的。

304 (Not Modified/为修正)

当客户端有一个缓存的文档，通过提供一个 If-Modified-Since 头信息可指出客户端只希望文档在指定日期之后有所修改时才会重载此文档，用这种方式可以进行有条件的请求。304 (SC_NOT_MODIFIED)是指缓冲的版本已经被更新并且客户端应刷新文档。另外，服务器将返回请求的文档及状态码 200。servlet一般情况下不会直接设置这个状态码。它们会实现getLastModified方法并根据修正日期让默认服务方法处理有条件的请求。这个方法的例程已在2.8部分(An Example Using Servlet Initialization and Page Modification Dates/一个使用servlet初始化和页面修正日期的例子)给出。

305 (Use Proxy/使用代理)

305 (SC_USE_PROXY)表示所请求的文档要通过定位头信息中的代理服务器获得。这个状态码是新加入 HTTP 1.1中的。

307 (Temporary Redirect/临时重定向)

浏览器处理307状态的规则与302相同。307状态被加入到 HTTP 1.1中是由于许多浏览器在收到302响应时即使是原始消息为POST的情况下仍然执行了错误的转向。只有在收到303响应时才假定浏览器会在POST请求时重定向。添加这个新的状态码的目的很明确：在响应为303时按照GET和POST请求转向;而在307响应时则按照GET请求转向而不是POST请求。注意：由于某些原因在HttpServletResponse中还没有与这个状态对应的常量。该状态码是新加入HTTP 1.1中的。

注意

在 HttpServletResponse 中没有 SC_TEMPORARY_REDIRECT 常量，所以你只能显示的使用307状态码。

400 (Bad Request/错误请求)

400 (SC_BAD_REQUEST)指出客户端请求中的语法错误。

401 (Unauthorized/未授权)

401 (SC_UNAUTHORIZED)表示客户端在授权头信息中没有有效的身份信息时访问受到密码保护的页面。这个响应必须包含一个WWW-Authenticate的授权信息头。例如，在本书4.5部分中的“Restricting Access to Web Pages./限制访问Web页。”

403 (Forbidden/禁止)

403 (SC_FORBIDDEN)的意思是除非拥有授权否则服务器拒绝提供所请求的资源。这个状态经常会由于服务器上的损坏文件或目录许可而引起。

404 (Not Found/未找到)

404 (SC_NOT_FOUND)状态每个网络程序员可能都遇到过，他告诉客户端所给的地址无法找到任何资源。它是表示“没有所访问页面”的标准方式。这个状态码是常用的响应并且在HttpServletResponse类中有专门的方法实现它：sendError("message")。相对于setStatus使用sendError得好处是：服务器会自动生成一个错误页来显示错误信息。但是，Internet Explorer 5浏览器却默认忽略你发挥的错误页面并显示其自定义的错误提示页面，虽然微软这么做违反了 HTTP 规范。要关闭此功能，在工具菜单里，选择Internet选项，进入高级标签页，并确认“显示友好的 HTTP 错误信息”选项(在我的浏览器中是倒数第8各选项)没有被选。但是很少有用户知道此选项，因此这个特性被IE5隐藏了起来使用户无法看到你所返回给用户的信息。而其他主流浏览器及IE4都完全的显示服务器生成的错误提示页面。可以参考图6-3及6-4中的例子。

核心警告

默认情况下，IE5忽略服务端生成的错误提示页面。

405 (Method Not Allowed/方法未允许)

405 (SC_METHOD_NOT_ALLOWED)指出请求方法(GET, POST, HEAD, PUT, DELETE, 等)对某些特定的资源不允许使用。该状态码是新加入 HTTP 1.1中的。

406 (Not Acceptable/无法访问)

406 (SC_NOT_ACCEPTABLE)表示请求资源的MIME类型与客户端中Accept头信息中指定的类型不一致。见本书7.2部分中的表7.1(HTTP 1.1 Response Headers and Their Meaning/HTTP 1.1响应头信息以及他们的意义)中对MIME类型的介绍。406是新加入 HTTP 1.1中的。

407 (Proxy Authentication Required/代理服务器认证要求)

407 (SC_PROXY_AUTHENTICATION_REQUIRED)与401状态有些相似，只是这个状态用于代理服务器。该状态指出客户端必须通过代理服务器的认证。代理服务器返回一个Proxy-Authenticate响应头信息给客户端，这会引起客户端使用带有Proxy-Authorization请求的头信息重新连接。该状态码是新加入 HTTP 1.1中的。

408 (Request Timeout/请求超时)

408 (SC_REQUEST_TIMEOUT)是指服务端等待客户端发送请求的时间过长。该状态码是新加入 HTTP 1.1中的。

409 (Conflict/冲突)

该状态通常与PUT请求一同使用，409 (SC_CONFLICT)状态常被用于试图上传版本不正确的文件时。该状态码是新加入 HTTP 1.1中的。

410 (Gone/已经不存在)

410 (SC_GONE)告诉客户端所请求的文档已经不存在并且没有更新的地址。410状态不同于404，410是在指导文档已被移走的情况下使用，而404则用于未知原因的无法访问。该状态码是新加入 HTTP 1.1中的。

411 (Length Required/需要数据长度)

411 (SC_LENGTH_REQUIRED)表示服务器不能处理请求(假设为带有附件的POST请求)，除非客户端发送Content-Length头信息指出发送给服务器的数据的大小。该状态是新加入 HTTP 1.1的。

412 (Precondition Failed/先决条件错误)

412 (SC_PRECONDITION_FAILED)状态指出请求头信息中的某些先决条件是错误的。该状态是新加入 HTTP 1.1的。

413 (Request Entity Too Large/请求实体过大)

413 (SC_REQUEST_ENTITY_TOO_LARGE)告诉客户端现在所请求的文档比服务器现在想要处理的要大。如果服务器认为能够过一段时间处理，则会包含一个Retry-After的响应头信息。该状态是新加入 HTTP 1.1的。

414 (Request URI Too Long/请求URI过长)

414 (SC_REQUEST_URI_TOO_LONG)状态用于在URI过长的情况时。这里所指的“URI”是指URL中主机、域名及端口号之后的内容。该状态是新加入 HTTP 1.1的。

415 (Unsupported Media Type/不支持的媒体格式)

415 (SC_UNSUPPORTED_MEDIA_TYPE)意味着请求所带的附件的格式类型服务器不知道如何处理。该状态是新加入 HTTP 1.1的。

416 (Requested Range Not Satisfiable/请求范围无法满足)

416表示客户端包含了一个服务器无法满足的Range头信息的请求。该状态是新加入 HTTP 1.1的。奇怪的是，在servlet 2.1版本API的HttpServletResponse中并没有相应的常量代表该状态。

注意

在servlet 2.1的规范中，类HttpServletResponse并没有SC_REQUESTED_RANGE_NOT_SATISFIABLE 这样的常量，所以你只能直接使用416。在servlet 2.2版本之后都包含了此常量。

417 (Expectation Failed/期望失败)

如果服务器得到一个带有100-continue值的Expect请求头信息，这是指客户端正在询问是否可以在后面的请求中发送附件。在这种情况下，服务器也会用该状态(417)告诉浏览器服务器不接收该附件或用100 (SC_CONTINUE)状态告诉客户端可以继续发送附件。该状态是新加入 HTTP 1.1的。

500 (Internal Server Error/内部服务器错误)

500 (SC_INTERNAL_SERVER_ERROR) 是常用的“服务器错误”状态。该状态经常由CGI程序引起也可能(但愿不会如此!)由无法正常运行的或返回头信息格式不正确的servlet引起。

501 (Not Implemented/未实现)

501 (SC_NOT_IMPLEMENTED)状态告诉客户端服务器不支持请求中要求的功能。例如，客户端执行了如PUT这样的服务器并不支持的命令。

502 (Bad Gateway/错误的网关)

502 (SC_BAD_GATEWAY)被用于充当代理或网关的服务器;该状态指出接收服务器接收到远端服务器的错误响应。

503 (Service Unavailable/服务无法获得)

状态码503 (SC_SERVICE_UNAVAILABLE)表示服务器由于在维护或已经超载而无法响应。例如，如果某些线程或数据库连接池已经没有空闲则servlet会返回这个头信息。服务器可提供一个Retry-After头信息告诉客户端什么时候可以在试一次。

504 (Gateway Timeout/网关超时)

该状态也用于充当代理或网关的服务器;它指出接收服务器没有从远端服务器得到及时的响应。该状态是新加入 HTTP 1.1的。

505 (HTTP Version Not Supported/不支持的 HTTP 版本)

505 (SC_HTTP_VERSION_NOT_SUPPORTED)状态码是说服务器并不支持在请求中所标明 HTTP 版本。该状态是新加入 HTTP 1.1的。


评论(0) 浏览(3053)

如何衡量设计价值？

涛涛

本文来和大家讨论数值框架提取与数据分析运用是怎么相辅相成来推动游戏化项目，帮助设计团队提升设计专业性和展示产品思维的。分为 2 大块：如何在设计中平衡效益、如何衡量设计价值。下面会从这 2 个游戏项目：独立小游戏《嘛哩嘛哩汪》、会员游戏《天天加速》来剖析。

如何在设计中平衡效益

要了解这件事，首先需要简单介绍下什么是数值，在游戏公司里有个职位叫数值策划，他是解决游戏里数值平衡和经济平衡的。在这里，我们不用专业术语，我们的也没游戏公司的那么难。我总结一下电商里容易理解运用的，就是这么一条公式：

下面讲的时候大家可以用这个思路（文中都叫数值框架）来理解并试试能不能运用。

1. 快速理解游戏的玩法（数值框架的运用）

举个例子，我们之前做的独立小游戏《嘛哩嘛哩汪》，用户可以领到一只同样的小土狗，通过不同的社交玩法：比如战斗，发送偷偷告白的小纸条等等，最终把自己的狗狗变成一只的萌宠换装养成游戏。

它的主要功能模块有采金（收金币）、对战、魔法屋（换装）。

有货币系统（金币、钻石、氪金）、等级系统（阶级经验值）、任务系统、道具系统（商店、背包）、社交系统（打 call、好友、消息）等。

这样乍一看，是不是觉得有点复杂？其实只要抓住关键流向节点，比如主要货币金币、成长体系的经验值，这种流入流出最频繁的地方就是关键流向节点，再把游戏主要功能系统串起来，主要功能就是关键流向节点流向最多的地方。这样串联起来就非常简洁明了，一眼就知道这个游戏怎么玩（如下图），通过采金、pk（主要功能）得到金币（关键流向节点），可以用来购买新装备去换装（主要功能），但需要靠做任务（社交、互动）去提升经验值（关键流向节点），才能不断解锁新装备，养成一只的狗仔。

当提取了最简单的框架后，再去细分支线数值，会清晰很多，最后细化的数值从系统的组成和期望去架构数值表和体系：如何实现、从哪里获取数据、如何方便又泛用化表格、精简配置、去除冗余数据等；大白话就是解决比如：升阶太慢，要调整；金币太快，装备很快买完了，玩不下去了，要调整；用户可操作太少了，要调整；装备售价多少金币，多少钻石适合？道具使用时长多久？任务成就奖励怎么设定，要送用户什么？等等这些问题…….

而这些在项目后续可能会困扰的问题其实在初期设计的时候就可以先规划，照顾到。

2. 数值框架在其他项目中的运用

这样的思路也很适合分析运营活动，快速抓住别人玩法中最吸引用户的点，包括自己设计的时候也可以在前期就自我评估项目成本。大家可以拿淘金币和叠猫猫用这个思路试试看，这边是比较早期的分析，淘宝的迭代太快了。

先看看 19 年 6 月前的淘金币，已经有在大促的时候开垦土地，我们不说视觉，先来分析下它的布局思路。

用公式代入看看，业务的诉求植入在领水滴任务中，关键流向节点是水滴和金币，节点流向最多是种地（图中种子，这里讲功能），投金币。非常清晰的框架。而且棒的是大促期间只需要复用同一套框架变成种宝贝，这对多方来说效益是高的。我们可以看到现在很多都在做这个模式，也就是把框架工具化了，换皮不换骨。19 年双十一的全民开喵铺几乎把它套用到所有的阿里旗下产品，（下方图左）底部的任务入口（领喵币）和辅线内容（领组队红包）均根据产品来配置，设计的时候规划得很清晰。（下方图右）当养成思路之后在活动刚出体验的时候就可以分析它的设计框架意图，无需过度依赖网上分析也能知道它好在哪，自己设计的时候也会有好的借鉴。

那在做游戏化产品的时候，里面就有很多东西需要考量植入业务诉求后的平衡了，但游戏玩法肯定是相对简单些的。

3. 理解业务诉求和游戏玩法关系

拿游戏化产品-会员游戏《天天加速》举个例子。

天天加速是一款宇宙救援世界观的游戏，以加速为核心玩法。把产品的各项目标植入到加速的道具中，用户如需获得道具需要完成产品目标，获得奖励，从而实现双赢。

拿主线来说，如下图展示我们植入业务诉求的时候，按那条公式思路来思考，业务层级越高（越难做，比如购买），游戏中设定层级越低（不强推），但游戏和现实中反馈都越多/强，去激励用户做重任务。这样简单罗列，就可以让双方同学都容易理解，并提前规划后台配置和配置的数值建议，给运营同学留出后续自运营配置的空间。

副线射击游戏也是，按照这种思路，把成本均衡到，几乎相同的玩法，不同的配置成本差别是很大的，下表是对玩法影响最小的，这些产出比都会影响业务方是否为你的功能玩法买单。

当建立了数值框架后，对后续上线的数据分析和推导下一步的迭代有很好的指导作用，因为你清楚知道数据的用户操作行为、可以知道用户是怎么流失的，再综合客户的投诉建议，用研同学的调研，可以较全面的整合处理。

如何衡量设计价值

这里还是拿游戏化产品-会员游戏《天天加速》举个例子。主要从以下3个方面，通过《会员游戏-天天加速》这个项目不同版本迭代来讲。（具体数据均不能透露）。

1. 建立数据体系，验证设计价值—1.0版

前面已经介绍过游戏是怎么玩的，这里直接讲 1.0 数据结论：在上线 7 天的时候就超额完成 kpi 了，其中 pv 是 kpi 预期 2.5 倍，任务完成率是 kpi 3 倍，近 90% 的用户都来打卡签到。超出我们预期挺多的。

但是数据好=我们的价值么？这也是我们从开始做就很想验证的，我们来看看方式。

建立数据体系、量化设计指标

在前期就和业务方达成共识，把他们的 kpi 指标任务活跃和用户上行，拆解成了游戏中的具体指标。再根据指标，对应到游戏中用户完成操作的行为流程，便可对应 kpi 的数据埋点。

最后，等埋点数据出来了，再用工具具体分析。流程可以看下图~

每周根据数据，发现规律、解决问题

具体的分析，我给大家举个例，这里是各个 kpi 数据的长线跟踪，一个点的数据是说明不了问题的，重点在怎么去维持和提高。第一张图可以看到，项目上线后，uv、pv 稳定上升，但在第 6 周开始回落，我们需要敏感地察觉，并且进行分析，作出反应。当我们快速调整上线 2.0 的时候，在第 11 周数据又开始回涨。

所以需要我们对数据敏感，有解读能力，和对项目的深刻理解。不然数据就只是数据，结论可能是因人而异的，当然有现成后台直接看数据结论最好，但没有的时候也得能处理，野外求生技能还是得有的。

构建合适的数据分析框架

我把如何分析数据的全流程复制下来，每周都会把收集的数据进行梳理，按照流程把各 kpi 的数据梳理一遍，发现问题就去沟通解决推动。这样也保证项目数据能持续稳定地增长。

其实做到这一步，我们已经是项目密不可分的一部分了，谁又能否定我们的价值呢。

那数据分析除了能验证设计的价值，还能做什么？

我们再来详细说说，是如何通过分析数据指标提升游戏体验的。我们按版本迭代来看看。

2. 分析指标数据，提升游戏体验

首先，我们可以把数据分成两个层面去看：用户操作数据和产品目标达成数据，业务方更多关注的肯定是产品目标的达成数据，那我们就多分析用户操作数据，2 边汇集，能更好地推动项目。

我们举些例子～

刚说了数据需要长线跟踪，需要发现变化规律，那如图，到了第 7 周，发现数据开始回落，但依旧超过了 kpi。我们去梳理原因，最大的原因是游戏 1.0 只上线了最简单的核心玩法，用户回访多，但没有太多可操作的内容，久而久之，回访自然会下降，所以我马上拉着产品讨论稳住 pv 的方案，同时还满足产品新诉求，植入发放优惠券，并且需要快速上线。这就是 2.0 版稳住 pv 的方案，事件系统，就是画面一中，右下角的小信封。用户每次回访，都有事件系统可操作，系统里会根据问答随机给到优惠券或者游戏道具。保证用户每次回访都有事可做，有利可图。

的确上线后数据开始回涨，也是首次破 8，数据是暂时稳定了，但是我们也明白这个版本下用户没有长线留存的理由。我们必须给用户带来积累感和晋升感，才能让用户对自己的付出有感知。于是我马上策划和实现了长线粘性的新增玩法，让用户除开机械的事件操作，还有主动的互动操作。
在图一主页面的左下角，有了一个寻宝行动的入口，是个射击游戏，用户可以通过击落陨石获得高分开宝箱，得到更多用于飞船升级的核能源，积累越多可以换取越高阶的飞船，对应更丰厚的奖品，因此长线的留存在游戏中。

3. 拓宽设计边界，提升产品目标

前两点，我都在不断地去帮助产品达成目标。那我们是不是可以再去拓宽设计的边界，提升产品的目标呢？

当我们上线 1 个多月时，得到了向好的业务数据，但是我们知道，这是基于用户的基数大，11% 的转化已经可以带来这么大的订单额，如果我们能撬动另外 90% 的用户呢？因此我去分析了游戏用户，发现对促销敏感度高的用户，不管是在全量用户还是核心用户中，都超过 70%，是相当明确的用户类型。

于是有了这三者的考虑：

优化转化目标、寻找合作可能性更高的业务方向、结合我们核心用户的促销敏感度高的特点，也去挖掘了一些方向。考虑产品运营成本实现的方式去出了 2 个方案，

第一个方案：转化入口的优化。

用户要得到虫洞道具，需要去购买商品。业务诉求有发券的 kpi，那在购买同时配合得到类目优惠券，这样就能大大的提升用户的购买诉求。

第二个方案：植入事件系统

系统事件，之前是只有送优惠券的功能，现在加入跨品类低价商品的推送+对应优惠券的功能，再次打游戏用户对价格敏感的痛点，目标是提升两者的转化。
当然业务有更多深入的考量，我们既然有一些想法能共同推进项目，那就多多沟通交流。

那到这里，文章终于要结束了，通篇其实是在通过实际的项目告诉大家数据框架（开篇那条公式思路）和数据分析能怎么贯穿整个项目，怎么去平衡各方成本，相辅相成地去推动项目、验证设计价值的。

最后一点小体会，在做这 2 类项目中，我最深刻的感受是独立小游戏里游戏内容是绝对主角，难点在没接触过的游戏引擎技术的攻克和数值的实现打通（游戏资质和法务问题也很麻烦），而游戏化产品里业务诉求和游戏化的包装是双主角，难的是两者的紧密结合和推动落地。第二种在策划的时候很容易把玩游戏当成主题，但电商公司做游戏化最主要是想让用户多回访，在平台购物，带来商业效益。因此，前期都比较阉割，需要看到它为业务带来实际效益，才有后续的为「趣味性」买单的资源研发投入，这个「游戏」的取舍其实挺难过的。

文章来源：优设    作者：JellyDesign

评论(0) 浏览(3300)

国内顶尖网课平台CC talk ，是如何做好网师分层体系设计的？

涛涛

项目背景

网师分层对平台的重要性不言而喻，诸如阿里这类的电商平台都有完善的商家分级体系，明确了不同等级的权益和运营策略。

2019 年底 CCtalk 平台的网师数量达到了一定规模，平台的基础能力建设也相对完善，因此网师分层的事宜被提上日程。此前我们评估网师的方式是按照流水，将网师分为普通网师、中部网师和大 V 网师 3 类，不同网师对产品功能需求及运营要求差别很大。这种粗略的划分方式可以帮助简单评估网师，但并没有产品化，而且只有单一的 GMV 维度，不够全面客观。有些客单价较低的网师也有大量的购课学生，他们对平台的价值也高。因而我们需要推出一套综合网师流水、招生数量、内容质量等多个维度的方法来进行分层运营。

面对以上问题，相应的解决方案是：

  • 建立商户等级体系
  • 等级权益差别化
  • 增加权益购买触点

价值分析

既然是涉及全平台网师的重大升级调整，当然要从全局的角度来进行价值分析。我在这个项目中探索了用于多角色价值分析的「三维价值分析法」，从整个关系链的角度来解析网师分层对网师和平台的价值。

Step1.列出相关利益者

分别包括：CCtalk平台、网师、学生。

△ 列出相关利益者

Step2.设定中心点并建立关系

分析连接这3种角色的关键点是什么。我们CCtalk作为一个在线教育平台，最核心的因素是内容，因而将中心点设定为「内容」。（注意，如果此时是做某个具体功能相关的项目，那么中心点可以是这个具体的功能，例如「作业」或「直播」）设定中心点后，建立不同角色和中心点之间的双向关系。

△ 设定中心点并建立关系

Step3.进行全局价值分析

在上一步的关系网的基础上，用圆弧连接相邻角色的价值走向关系，从全局的角度进行不同角色间的价值分析。

△ 进行全局价值分析

从上面的三维图中可以看出网师分层对于平台和网师的价值。
对网师来说，有助于：了解成长路径，获得更多产品运营支持，获取更多功能权益。

对平台来说，可以：筛选网师，激励网师自驱动，增加收入。另外，还有一些间接的价值，包括通过督促网师生产高质量的内容来提升平台的价值，通过督促网师积极招生来扩大用户规模。

△ 网师分层对于平台和网师的价值

项目拆解

刚接到需求时，我内心的 OS 是：大项目！概念大，范围广，都有点不知从哪里入手。

冷静下来分析，网师分层本质是一套针对商户端的激励体系。从下往上拆解：由底层商户活跃度来计算经验值，根据经验值划分商户等级，并赋予不同等级不同的权益，权益包括教学核心功能：直播时长，素材存储空间，课程人数等。再向上衍生到不同权益对应的使用场景，以及权益的扩展方式。

△ 分层拆解

从设计层面，分为信息展示和场景触达两部分。这么一看，其实又挺简单。

设计落地

由于项目涉及的底层逻辑多，时间周期跨度大，因此拆分成 3个小版本来实现：商户权益改造，经验值等级底层 & 商户等级外显。前期的功能实现后，先预埋在版本中。等到经验等级上线时统一发布。其中经验值等级底层项目是纯技术，不涉及设计。

所以下面将从功能权益分层和等级经验值外显两部分来讲解具体的设计过程。

Part1. 功能权益分层

功能权益分层是权益的使用层面，包括多场景触达和引导购买增量包。设计时分为场景梳理→设计要点→细化直播场景→具体设计这 4 步来实施。

Step A.场景梳理

拆解权益的生命周期，可分为三个阶段：充足可用，即将不足，已用尽。而功能的使用场景——直播，也分为三个阶段：直播前，直播中，直播后。

Step B.设计要点

将权益生命周期和直播场景结合进行交叉分析，列出设计要点和具体的设计拆解。

△ 不同阶段的设计要点及拆解

Step C.细化直播场景

发起直播的入口很多，除了「立即直播」的主场景之外，还有由预告进入直播的 3 种场景，如果在每个入口都做功能禁用判断的话，不仅逻辑会很复杂，开发实现起来成本也比较大。

于是将直播前的流程细化，发现「直播检测」是进入直播间的必经环节，因此将功能禁用的判断节点缩减为 2 处：「立即直播」&「直播检测」。

△ 细化直播场景

Step D.具体设计

有了前期的分析后，具体设计环节就相对容易了。下面以点击「立即直播」时的功能余量判断为例。

点击「立即直播」按钮，在按钮原有的逻辑上加上新的判断逻辑，此处要注意写清楚他们之间的优先级关系。如果在不了解背景的情况下，很可能就直接写点击按钮进行可用直播时长的判断，那需求宣讲的时候开发就会问你，和原来按钮上的逻辑是什么关系呢，此时就会一阵紧张。

△ 立即直播时判断剩余可用直播时长

Part2. 等级经验值

等级经验值属于展示层。对网师用户来说，最重要的是了解自己当前处于哪个等级以及相应的权益有哪些。对平台来说，除了明确每个等级及相应的权益，重要的是要引导网师升级，以激发他们的自驱力。

由此推导出相应的设计方法：锚定目标、降低门槛和利益点吸引。

△ 设计方法

在设计方法的指导下进行落地，分为网师后台首页的展示，以及等级详情页的设计两部分。

网师后台首页-个人信息模块的展示

由于等级和权益挂钩，涉及网师切身利益，因而在网师后台首页的个人信息模块，增加当前的经验值和相应等级的展示。同时，通过利益点吸引等方式，引导网师向下一个等级努力。

△ 个人信息模块展示

等级详情页的设计

点击等级进入详情页，除了 Lv0 是将所有权益无差别展示，其他等级都是优先展示新增部分，包括新获得的普通权益和附赠的高级功能。另外，用「箭头」和「NEW」的图标帮助用户区分是老权益的内容升级，还是新增的权益。

总结反思

1. 前期缺乏深入调研

由于涉及网师的切身利益，因而此功能受到了网师们前所未有的关注。上线前一周，运营以邮件、通知等形式向网师预热，3 月 5 日会上线这么一个功能。于是还没上线就有网师来咨询在哪里可以查看。刚上线就收到了大量的用户反馈，网师反馈群里的消息简直是秒速级地在刷屏。

其中，网师对每月直播时长限制的反响最为强烈，部分网师表示平台应该鼓励多直播，不能接受对直播时长的限制。因为直接关系到上课这个核心功能，时长不够课都上不了，网师们的言辞非常激烈。所以我们又重新评估了平台的直播成本，经过深入讨论，全面放开了每月的直播可用时长限制。

带来的反思是，如果前期有通过问卷、访谈等方式进行深入的用户调研，了解他们对核心权益的态度，那么在进行权益设置时就能有更全面的考量。

2. 中高等级跨度太大，缺乏激励效果

游戏任务的上手难度曲线一般是先平缓，再慢慢陡峭，越往上难度越大。我们的等级体系其实也是这个逻辑。初级到中级还较为容易，但再往上要非常难，要经过长时间的积累，一看就无望，难有激励效果。

因而我们之后的优化方向是在相邻等级中间设定一些小目标，达到可以提前赠送下一等级的新权益，以此来提高激励效果。

文章来源：优设    作者：鱼游设计

评论(0) 浏览(2693)

常见的HTTP状态码

seo达人

HTTP状态码

HTTP状态码（英语：HTTP Status Code）是用以表示网页服务器超文本传输协议响应状态的3位数字代码。它由 RFC 2616 规范定义的，并得到 RFC 2518、RFC 2817、RFC 2295、RFC 2774 与 RFC 4918 等规范扩展。所有状态码的第一个数字代表了响应的五种状态之一。所示的消息短语是典型的，但是可以提供任何可读取的替代方案。 除非另有说明，状态码是HTTP / 1.1标准（RFC 7231）的一部分。



HTTP状态码的官方注册表由互联网号码分配局（Internet Assigned Numbers Authority）维护。



微软互联网信息服务 （Microsoft Internet Information Services）有时会使用额外的十进制子代码来获取更多具体信息，但是这些子代码仅出现在响应有效内容和文档中，而不是代替实际的HTTP状态代码。



HTTP状态码分类



分类 分类描述

1 信息，服务器收到请求，需要请求者继续执行操作

2 成功，操作被成功接收并处理

3 重定向，需要进一步的操作以完成请求

4 客户端错误，请求包含语法错误或无法完成请求

5** 服务器错误，服务器在处理请求的过程中发生了错误

1xx 信息（消息）

这一类型的状态码，代表请求已被接受，需要继续处理。这类响应是临时响应，只包含状态行和某些可选的响应头信息，并以空行结束。由于 HTTP/1.0 协议中没有定义任何 1xx 状态码，所以除非在某些试验条件下，服务器禁止向此类客户端发送 1xx 响应。



100 Continue

继续。客户端应当继续发送请求。

101 Switching Protocols

切换协议。服务器根据客户端的请求切换协议。只能切换到更高级的协议，例如，切换到HTTP的新版本协议。



2xx 成功

这一类型的状态码，代表请求已成功被服务器接收、理解、并接受。



200 OK

请求成功。请求所希望的响应头或数据体将随此响应返回。出现此状态码是表示正常状态。

201 Created

已创建。成功请求并创建了新的资源。

202 Accepted

已接受。已经接受请求，但未处理完成。

203 Non-Authoritative Information

非授权信息。请求成功，但返回的meta信息不在原始的服务器，而是一个副本。

204 No Content

无内容。服务器成功处理，但未返回内容。在未更新网页的情况下，可确保浏览器继续显示当前文档。

205 Reset Content

重置内容。服务器处理成功，用户终端（例如：浏览器）应重置文档视图。可通过此返回码清除浏览器的表单域。

206 Partial Content

部分内容。服务器成功处理了部分GET请求，类似于 FlashGet 或者迅雷这类的 HTTP下载工具都是使用此类响应实现断点续传或者将一个大文档分解为多个下载段同时下载。



3xx 重定向

这类状态码代表需要客户端采取进一步的操作才能完成请求。通常，这些状态码用来重定向，后续的请求地址（重定向目标）在本次响应的 Location 域中指明。

当且仅当后续的请求所使用的方法是 GET 或者 HEAD 时，用户浏览器才可以在没有用户介入的情况下自动提交所需要的后续请求。客户端应当自动监测无限循环重定向（例如：A->A，或者A->B->C->A），因为这会导致服务器和客户端大量不必要的资源消耗。按照 HTTP/1.0 版规范的建议，浏览器不应自动访问超过5次的重定向。



300 Multiple Choices

多种选择。请求的资源可包括多个位置，相应可返回一个资源特征与地址的列表用于用户终端（例如：浏览器）选择。

301 Moved Permanently

永久移动。请求的资源已被永久的移动到新URI，返回信息会包括新的URI，浏览器会自动定向到新URI。今后任何新的请求都应使用新的URI代替。

302 Move Temporarily（Found）

临时移动。与301类似，但资源只是临时被移动，客户端应继续使用原有URI。

303 See Other

查看其它地址。与301类似，使用GET和POST请求查看。

304 Not Modified

未修改。所请求的资源未修改，服务器返回此状态码时，不会返回任何资源。客户端通常会缓存访问过的资源，通过提供一个头信息指出客户端希望只返回在指定日期之后修改的资源。

305 Use Proxy

使用代理。所请求的资源必须通过代理访问。

306 Switch Proxy

在版的规范中，306状态码已经不再被使用。它算是已经被废弃的HTTP状态码。

307 Temporary Redirect

临时重定向。与302类似，使用GET请求重定向。



4xx 客户端错误（请求错误）

这类的状态码代表了客户端看起来可能发生了错误，妨碍了服务器的处理。除非响应的是一个 HEAD 请求，否则服务器就应该返回一个解释当前错误状况的实体，以及这是临时的还是永久性的状况。这些状态码适用于任何请求方法。浏览器应当向用户显示任何包含在此类错误响应中的实体内容。

如果错误发生时客户端正在传送数据，那么使用TCP的服务器实现应当仔细确保在关闭客户端与服务器之间的连接之前，客户端已经收到了包含错误信息的数据包。如果客户端在收到错误信息后继续向服务器发送数据，服务器的TCP栈将向客户端发送一个重置数据包，以清除该客户端所有还未识别的输入缓冲，以免这些数据被服务器上的应用程序读取并干扰后者。



400 Bad Request

客户端请求的语法错误，服务器无法理解。

401 Unauthorized

当前请求需要用户验证。

402 Payment Required

该状态码是为了将来可能的需求而预留的。（保留，将来使用。）

403 Forbidden

服务器理解请求客户端的请求，但是拒绝执行此请求。

404 Not Found

请求失败，请求所希望得到的资源未被在服务器上发现。没有信息能够告诉用户这个状况到底是暂时的还是永久的。假如服务器知道情况的话，应当使用410状态码来告知旧资源因为某些内部的配置机制问题，已经永久的不可用，而且没有任何可以跳转的地址。404这个状态码被广泛应用于当服务器不想揭示到底为何请求被拒绝或者没有其他适合的响应可用的情况下。出现这个错误的最有可能的原因是服务器端没有这个页面。

405 Method Not Allowed

客户端请求中的方法被禁止，也就是请求行中指定的请求方法不能被用于请求相应的资源。该响应必须返回一个Allow 头信息用以表示出当前资源能够接受的请求方法的列表。

406 Not Acceptable

服务器无法根据客户端请求的内容特性完成请求，也就是请求的资源的内容特性无法满足请求头中的条件，因而无法生成响应实体。

407 Proxy Authentication Required

与401响应类似，只不过客户端必须在代理服务器上进行身份验证。代理服务器必须返回一个 Proxy-Authenticate 用以进行身份询问。客户端可以返回一个 Proxy-Authorization 信息头用以验证。参见RFC 2617。

408 Request Timeout

请求超时。客户端没有在服务器预备等待的时间内完成一个请求的发送。客户端可以随时再次提交这一请求而无需进行任何更改。

409 Conflict

由于和被请求的资源的当前状态之间存在冲突，请求无法完成。这个代码只允许用在这样的情况下才能被使用：用户被认为能够解决冲突，并且会重新提交新的请求。该响应应当包含足够的信息以便用户发现冲突的源头。

冲突通常发生于对 PUT 请求的处理中。例如，在采用版本检查的环境下，某次 PUT 提交的对特定资源的修改请求所附带的版本信息与之前的某个（第三方）请求向冲突，那么此时服务器就应该返回一个409错误，告知用户请求无法完成。此时，响应实体中很可能会包含两个冲突版本之间的差异比较，以便用户重新提交归并以后的新版本。

410 Gone

客户端请求的资源已经不存在。410不同于404，如果资源以前有现在被永久删除了可使用410代码，网站设计人员可通过301代码指定资源的新位置。

411 Length Required

服务器拒绝在没有定义 Content-Length 头的情况下接受请求。在添加了表明请求消息体长度的有效 Content-Length 头之后，客户端可以再次提交该请求。

412 Precondition Failed

客户端请求信息的先决条件错误，也就是服务器在验证在请求的头字段中给出先决条件时，没能满足其中的一个或多个。这个状态码允许客户端在获取资源时在请求的元信息（请求头字段数据）中设置先决条件，以此避免该请求方法被应用到其希望的内容以外的资源上。

413 Request Entity Too Large

服务器拒绝处理当前请求，因为该请求提交的实体数据大小超过了服务器愿意或者能够处理的范围。此种情况下，服务器可以关闭连接以免客户端继续发送此请求。

如果这个状况是临时的，服务器应当返回一个 Retry-After 的响应头，以告知客户端可以在多少时间以后重新尝试。

414 Request-URI Too Long

请求的URI过长（URI通常为网址），服务器无法处理。

415 Unsupported Media Type

服务器无法处理请求附带的媒体格式，也就是对于当前请求的方法和所请求的资源，请求中提交的实体并不是服务器中所支持的格式，因此请求被拒绝。

416 Requested Range Not Satisfiable

客户端请求的范围无效，也就是如果请求中包含了 Range 请求头，并且 Range 中指定的任何数据范围都与当前资源的可用范围不重合，同时请求中又没有定义 If-Range 请求头，那么服务器就应当返回416状态码。

417 Expectation Failed

服务器无法满足Expect的请求头信息，也就是在请求头 Expect 中指定的预期内容无法被服务器满足，或者这个服务器是一个代理服务器，它有明显的证据证明在当前路由的下一个节点上，Expect 的内容无法被满足。



5xx 服务器错误

这类状态码代表了服务器在处理请求的过程中有错误或者异常状态发生，也有可能是服务器意识到以当前的软硬件资源无法完成对请求的处理。除非这是一个HEAD 请求，否则服务器应当包含一个解释当前错误状态以及这个状况是临时的还是永久的解释信息实体。浏览器应当向用户展示任何在当前响应中被包含的实体。这些状态码适用于任何响应方法。



500 Internal Server Error

服务器内部错误，无法完成请求。服务器遇到了一个未曾预料的状况，导致了它无法完成对请求的处理。一般来说，这个问题都会在服务器端的源代码出现错误时出现。

501 Not Implemented

服务器不支持当前请求所需要的某个功能。当服务器无法识别请求的方法，并且无法支持其对任何资源的请求。

502 Bad Gateway

作为网关或者代理工作的服务器尝试执行请求时，从远程服务器接收到了一个无效的响应。

503 Service Unavailable

由于临时的服务器维护或者过载，服务器当前无法处理请求。这个状况是临时的，并且将在一段时间以后恢复。如果能够预计延迟时间，那么响应中可以包含一个 Retry-After 头用以标明这个延迟时间。如果没有给出这个 Retry-After 信息，那么客户端应当以处理500响应的方式处理它。

注意：503状态码的存在并不意味着服务器在过载的时候必须使用它。某些服务器只不过是希望拒绝客户端的连接。

504 Gateway Timeout

作为网关或者代理工作的服务器尝试执行请求时，未能及时从上游服务器（URI标识出的服务器，例如HTTP、FTP、LDAP）或者辅助服务器（例如DNS）收到响应。

505 HTTP Version Not Supported

服务器不支持，或者拒绝支持在请求中使用的 HTTP 版本。这暗示着服务器不能或不愿使用与客户端相同的版本。响应中应当包含一个描述了为何版本不被支持以及服务器支持哪些协议的实体。



感谢观看！

参考资料：

https://www.runoob.com/http/http-status-codes.html

若想了解更多请参考：

HTTP状态码百度百科

https://blog.csdn.net/GarfieldEr007/article/details/77984065


评论(0) 浏览(2478)

学渣代表HTML知识基础语法篇

seo达人

HTML基础知识

第一篇，HTML的结构

HTML中两个概念

(1).HTML标签：<元素名称></元素名称>

  完整语法：<元素名称>要控制的元素</元素名称>

HTML标签分为两种： 成对：只对标签内的元素起作用

                                    单独：在相应位置插入换行

标签属性设置在元素的首标签：语法：<元素 属性1=“值1” …>元素资料</元素>,""可省略

HTML元素： 一组标签将一段文字包含在中间，这一组标签与文字就是元素

结构

在所有的HTML文件中最外层由标签建立，并包含两个子标签：元素为文件标题 ：元素为文件主题



：说明文件标题和文件的一些公共属性 ：文件主体

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>HTML结构</title>

</head>

<body>

Hellow Word！

</body>

</html>


评论(0) 浏览(3198)

非科班设计教主陈幼坚的故事—香港设计史（下集）——【设计史太浓】

鹤鹤

聊到香港设计，当聊完靳埭强大家也基本能猜到接下来会聊谁，自然就是香港第三代设计师的代表人物陈幼坚，他的成就跟靳埭强可谓旗鼓相当，所以继靳埭强被封香港设计教父后，他也被封为香港设计教主，按文无第一的原则，也无谓去为他们成就分一个高低，就好比香港歌坛的谭咏麟张国荣，你喜欢谁都是对的。

陈幼坚在国际上的名声是超越了诸多香港著名设计师的，他职业生涯当中获得了600多个奖项，其中更是以国际奖项为主，包括美国、英国及日本的设计大奖，特别在日本他的名声就跟成龙在演艺圈一样的响当当，也有很多人评价他的作品受日本风格影响很大，后来他自己也回应过非常喜欢日本设计，在1991年及2002年他曾或日本东京邀约，举办了"东方汇合西方"、"东情西韵"个人展览。

 

跟前面两位大师一样，石汉瑞是“跨文化设计”，靳埭强是“中国传统结合西方现代”，陈幼坚则是“东情西韵”，都离不开东西方文化的碰撞路径，个人认为这是可以给内地设计师一些重大启发的。

相对陈幼坚的名声地位，令人感到非常不解的是原来他并非设计科班出生，也没有严谨的设计专业学习经历。

 

陈幼坚1950年出生在香港，父亲是一名普通的水果摊主，母亲是澳门人，也是普通家庭主妇，都没有受过高等教育，陈幼坚小时候是一名品学兼优的学生，兴趣也很广泛，中学时候入读了西味浓厚的嘉道理爵士中学，但这时候陈幼坚早恋了，交了女朋友的他有点无心向学，不久就辍学去机构做了十个月的代课教师，然后又无法忍受循规蹈矩的教学工作，幸亏在嘉道理爵士中学培养出不错的英文功底，陈幼坚去了一所外资广告公司做学徒，为了尽快适应工作，期间他参加了一个为期个月的香港大一艺术设计学院夜间设计课程的学习，这也是他人生中唯一受过的设计教育经历。


20岁的陈幼坚从助理学徒开始，在广告界努力奋斗了十年，基本都在外国老板的公司里，这也是后来陈幼坚回忆让他得以从西方角度看东方的重要原因，在1980年时，30岁的陈幼坚比较厌倦广告公司的比稿情况跟复杂人事（当时的香港免费比稿成风，甚至引发了设计师集体抗议的运动），跟妻子一起出来独立创业，成立达尔讯广告公司，6年后更名为“陈幼坚广告设计公司”。


已经有40多载设计经历的陈幼坚代表作数不胜数，这里我们选择一部分来谈谈，比方为娱乐圈大咖们的设计、可口可乐的中文标识设计，罗西尼手表的海报设计，香港城市形象设计。

 

很多人都不知道，陈幼坚在80年代为众多当红巨星设计过演唱会海报、唱片封面，其中有罗文、林子祥、梅艳芳、张学友、周华健跟张国荣等等，其中张国荣是跟陈幼坚合作最久的，整个八十年代，从初出道到89年告别演唱会《FINAL ENCOUNTER》陈幼坚都担任美术指导，一手包办他的个人大碟。但陈幼坚并没有将这些创作放到公司的案例当中，他认为这件事他的兴趣大于商业，所以很多人都不知道，在张国荣61岁冥寿时，陈幼坚参加一个访谈才相对详细的回顾了他跟哥哥的这段交情。

到了2000年时候，50岁的陈幼坚为罗西尼手表设计的海报，让很多人都印象深刻，也是我对其印象最深刻的设计之一，海报上的刻度不是以往的罗马数字或阿拉伯数字，而是换成了一些不完整的文字，但是时针的走动却能为每一时刻添上一笔，使其拼成一个完整的中文小写数字，简洁明了地体现了表盘的创意，这是中国元素运用在现代设计中的一个体现，这样的设计产品不但美观而且极具趣味性。

其实2000年左右是陈幼坚名声鹊起的关键阶段，除了罗西尼手表海报外，他相继完成了诸多重要项目，比方北京申办奥运的招贴画，在日本举办“东情西韵”个展，还有就是完成了可口可乐的中文标识设计。在我的《商业设计祖师爷—美国设计》里谈过，可口可乐享誉全球的英文标识第一次改造由美国工业设计之父雷蒙罗维完成，而陈幼坚在巨人之后承接中文标识设计的艰巨任务，可想而知需求方对他的专业认可及厚望的寄予，但也没有太多悬念，陈幼坚出色的完成了项目。

这是可口可乐中文标识自1979年进入中国以来首次大的变动。陈幼坚通过对“COCA-COLA”英文标识的仔细研究，发现其中的飘带和衬线笔划弧度的设计可以成为中西方两种字体风格相互映衬的契合点，经过巧妙的构思与反复的修改，为了和英文标识中斯宾塞（Spencerian s cript）衬线字体相互协调，他将之前传统的中文汉字改编设计成了弯曲流畅的“斯宾塞式”中文字体。从形式上看，多层次的飘柔丝带设计，和飘带中的银色边线，使标识更加富有时代感，经过微妙的调整和添加之后，原有的视觉元素被激活起来。从色彩上看，底色色彩为红色，字体色彩为白色银边，高纯度的红色与白色形成鲜明的对比，而银色边线则起到了降低饱和度的作用，再加上富有韵律的银白色飘带设计，使整个标识更加富有动感效果。

经过陈幼坚的创意设计，使可口可乐新的中文标识既有中国特点又兼具国际风范，让人一眼就能认出可口可乐家族的新成员。陈幼坚一直不断地发掘各种独特的创意思维，把已有的设计在自己的思维模式中进行解剖与重构，使作品完全脱离原本的面貌，诞生出新的意义和内涵。


然后是2008年时，已经58岁的陈幼坚为香港政府主笔形象升级项目。


这次形象升级经过了全市调研，包括举行专业民意调查、咨询会、核心小组讨论、工作坊、设立专门网站、比赛等，收集公众的意见和期望”；最后通过公开招标，最终确定陈幼坚的设计。


 

这个设计改造其实也引起了广泛讨论，有叫好有叫坏，其中内地的欧阳黎明曾经在红动论坛专门写贴来表示失望，并说如果由他来改造一定会更好，该贴引发了比较热烈的讨论，当时我还在读大学，也关注过此事，不管欧阳大师的动机如何，其实这种类型的改造肯定无法一致叫好，总会有持相反意见的群体存在。

这里也刚好可以谈一谈香港设计风格的问题，其实个人认为陈幼坚的这个城市形象改造是很符合香港设计风格里那种内核的，我在做这期内容时，专门去了一趟香港做详细观察，我希望身在当地来感受他们的设计氛围。

 

我为香港设计风格总结了几个特点：

 

1、 非常丰富缤纷的色彩计划（这点是给我最直接深刻的印象）。

2、 雅俗共存的设计环境

3、 东西方交融的商业特色风格

 

所谓为何我说陈幼坚的改造是符合香港设计精神内核，我们尝试将几张图放在一起比对，图片中我们看到香港的街景是全世界所独有的，具备非常突出东西交融的市井风格，一眼就能让人识别到：


你会发觉陈幼坚的这个形象图案是很符合香港设计给人的感觉，色彩丰富缤纷，既国际化又通俗化，有东方元素（龙）又具备西方形式（图形简洁），所以从这个角度刨析，陈幼坚的这个升级设计是很成功的，我们如果单纯从图案的好看与否来分析，未免太过浅薄了。

 

关于陈幼坚的故事大致聊到这里，他有诸多作品都是非常出色的，比如做了大量极为优秀的茶类商业设计，知道后来干脆自己创了一个品牌“MR CHAN 陈茶馆”，标识就是那个经典的佛手，又例如自己公司的标识四喜娃娃，又比如早期阴阳鱼概念的日本西武百货vi系统，不胜枚举，留待大家去发掘这些资料，自行品鉴。


最后补充一点：

 

客户跟设计师之间的结合就像婚姻一样，不存在一名设计师是通吃全部客户的，如同你再优秀也会有女生不喜欢你一样，就算大师超级明星都不行，因为每一名设计师在长期设计创作中会形成作品风格与气质，这些是作为匹配客户的主要因素，假设我的企业及产品倾向更加柔美、细腻、、精致的展示风格，那么相对靳埭强及陈幼坚，我可能会首先倾向选择陈幼坚，因为他似乎更加擅长，跟他的气质也更吻合。

这期关于香港设计历史的内容先聊到这里，我们除了讲述香港现代设计的发展起源，还合计介绍了三位大师，分别是石汉瑞、靳埭强及陈幼坚，其实计划聊多一些，但最后发觉最具代表性的还是这三位，聊多不如聊透，虽然最后发觉也许仍没有聊透，但所谓犹抱琵琶半遮面，剩下的一些空间等待大家自行研究其实更好。

 

下一期我们将继续国家之旅，以时空切换的方式，回到接近两百年前的英国，因为我们将为大家探究现代设计的萌芽之地，聊一聊英国设计。

 转自：站酷-设计史太浓 

评论(0) 浏览(3199)

教父靳埭强的故事——香港设计史（中集）——【设计史太浓】

鹤鹤

提起香港设计师，大部分人首先想到的就是香港设计教父靳埭强先生，他有诸多前无古人的创举，比方首位以设计师身份获选香港十大杰出青年的港人、唯一设计师获颁赠市政局设计大奖、首位华人名列世界平面设计师名人录、并获英国选为二十世纪杰出艺术家及设计师。在全球设计界都是大师级的人物，业内都亲切的称呼他为“靳叔”。

靳叔1942年出生于广州番禺， 15岁才跟随父亲到香港定居，所以并非土生土长的香港人。

 

靳叔祖父是广州有名的民间工艺师，从事灰塑建筑装饰艺术，还曾做过领班参与广州陈家祠的灰塑修建。同时伯父靳微天及姑母靳思薇早在五六十年代就是香港著名的画家。弟弟靳杰强是物理学博士，但受家庭人员的艺术背景影响，在国画方面也小有成就，跟靳叔一起哥俩多次在香港及美国举办二人联展，非常有意思。

 

很多人其实都知道靳叔并非学设计或者艺术出身的，而是一名裁缝，而且还是从学徒开始。1957年刚刚到港15岁的靳叔因为不忍心父亲独自一人撑起整个家庭的开支，所以虽然怀着艺术家理想，但必须先帮家里维持生计，所以就出来找了一份裁缝学徒的工作，从搞卫生等粗重杂碎活开始，通过努力的学习很快成为裁缝师傅，每天早出晚归，早上9点到晚上9点，并且一做就做了十年。

 

这十年之间靳叔内心还没有放弃自己的艺术梦，所以每逢周日有半天假期，就会跟大伯父学习水彩跟素描等基本功。终于，靳叔的人生转机在60年代末出现，这时候的香港刚刚经历“六七暴动”不久，港英政府对华人变得相对友善，实施“积极不干预政策”刺激香港经济，带动轻工业发展，其中就包括了设计业，而此时此刻，来自西方的设计师石汉瑞已经独立创业，经营图语设计公司，事业发展如日中天。

这一年，港中文大学开设了校外进修部的一个设计夜间课程班，授课老师是后来鼎鼎大名的王无邪（香港著名水墨画家及设计师），跟留学德国的钟培正，课程恰好就是教授德国包豪斯设计理论及平面设计。


靳叔被课程吸引了，马上报名。但课程是晚上7 点开课，而他晚上9 点半才能下班，刚好时间重叠，幸运的是靳叔当时的老板非常赏识他，同意他只要完成工作就能提前下班。通过这种方式靳叔白天做裁缝晚上学设计，此时的靳叔25岁。这里我们又推导了一下，靳叔按如此这般的师徒传承关系，属于包豪斯的第四代传人。

 

靳叔最具代表性的是水墨风格系列作品，但其实靳叔刚刚出道时候，一直做的都是非常包豪斯的设计，1967年，就在靳叔通过夜校学习设计三个月后，经同学介绍就去了玉屋百货做设计员，正式开始第一份设计工作，主要做橱窗设计及促销广告，历时一年。随后去了老师钟培正先生经营的恒美商业设计公司，从设计员开始，两年做到设计指导，4年做到设计总监，基本上恒美大部分成功案例都出自靳叔之手，在恒美靳叔一共呆了8年，这个时候的靳叔已经由懵懂少年成为一个成熟设计师。


而且这个期间的他还是一头长发的男子，但是已经找不到太多年轻时候的图片，长发形象一直伴随他到50岁。按时间推算，当时正值披头士风靡全港的时候，我们看回当时的男明星也普遍如此，比如粤语歌之父许冠杰先生。

在做包豪斯式的现代主义及美国式的国际主义风格设计的过程中，靳叔曾经把美国波普大师安迪•沃霍尔的波普艺术融入水墨画中，呈现机械型、几何型效果。获得了启发，靳叔开始思考“为什么是自己追他人的潮流，不是自己开创潮流？”于是开始把中国传统文化的精髓，融入西方现代设计的理念。传统书法的笔触被他大胆地融入设计，荷花、水墨、汉字这些极具中国文化意味的元素开始出现在他作品中。“靳氏风格”的设计水墨开始自成一派。

 

这个时候离开恒美的靳叔也开始正式自立门户，当时处于80年代初，他与同学张树新及几位旧同事合伙创业,成立新思域设计制作,这就是他现在公司“靳与刘”的前身。靳与刘当中的刘是指合伙人刘小康，同样是香港著名设计大师，代表作就是屈臣氏的包装设计。跟很多大师的情况雷同，经典的作品总是从独立经营公司后开始产生，而第一个让靳叔声名大噪的就是中国银行的标志。

1980年，靳埭强被中银集团总行委以设计标志，靳叔当时向中银集团总行香港分行的主管索要五位数报酬，他们觉得是天价，因为内地工人一个月工资才36 元。国内设计师设计一个标志才几十元。

 

受到古钱币的启发，靳叔以中国古钱币为基本形态，中间方孔，上下加垂直线，成为“中”字形状，又暗合天圆地方的意象。“想前人未想，做前人未做”、靳叔说，“如何让一张白纸变得好看？最重要是尝试、运用想象力让它独特，有趣味。”上世纪80 年代中期，中国银行开始在内地公开使用这个标志。而靳叔凭此获得CA 奖( 美国传达艺术奖)，名噪一时，这个时候的靳叔刚好40不惑。

靳叔在香港做设计的岁月里，服务了大量知名的企业，可以跟这些知名品牌共同成长，相互成就对方，其实关于这块让设计师很感触，就是为何要视每一个项目都是自己的孩子般爱惜，因为当设计师服务了这些企业就等于做了一项投资，如果你用足了心思让设计趋于完美，为客户充分考虑并全力以赴时，当这些品牌获得了发展，设计师也是受益者之一，比方靳叔服务荣华月饼时，荣华也并非一个大牌饼家，又比方力锐的欧阳黎明在2002年服务腾讯时，也并不知道它日后会成为庞然大物，同样的例子非常多，当这些品牌壮大时，提供设计服务的企业也会收到福荫，成为设计企业一笔有形的财产及品牌背书。

 

靳叔前后服务过的知名品牌包括：太太口服液、荣华饼家、樱雪沐浴露、嘉顿、麒麟啤酒、周生生珠宝等等。

随着香港回归，靳叔的靳与刘设计咨询公司也参与服务诸多内地项目，其中著名的有重庆市政府项目，就是重庆城市标志的设计。这个项目非常值得谈一谈，因为靳叔曾经说过：这是记忆力最困难的设计工作。

 

这个标志诞生的过程是“痛苦”的，“因为重庆的文化积淀非常深厚，任何一个具象的东西，如朝天门、解放碑、大礼堂等，都很难代表重庆。难就难在要得到当地市民的普遍认可。”为了充分了解这座城市，靳叔从五所大学找来设计专业学生座谈，了解重庆文化，收集大量资料。经过无数次修改，最终定稿的城标图案是两个人形的“庆”字。“庆”字的形象如手舞足蹈的人，喻意重庆人乐观向上的性格，也有“巴”文化“宽厚乐天”的意蕴；两个“庆”字叠加，又有“重”的意义，也体现了重庆作为超大城市接纳众多外来人口，兼容并蓄的特点。

而这个项目靳叔的设计费高达7位数，虽然设计费用不菲，但是靳叔说这是一个亏本的项目，因为整个项目历经了两年的时长才完成。由此我们再次要强调，一个标志的诞生并非单纯绘制一个图形那么的简单，大型项目中，设计工作的复杂程度可以非常高，同时也强调，不要认为设计的价格很低廉，尽管是7位数都仍然亏本了。

 

其实回顾起来，靳叔十年裁缝的工作背景对他的设计态度影响也很大，这种感受出自他本人：因为做衣服需要耐心，一针一线，跟设计很像，而且当时的衣服都是定制为主，你肥一些或者瘦一些都决定了衣服的差异，这点跟设计工作就更加像了。每一个项目来之前我们都不知道客户是谁，要求我们做什么，但是做出来的东西都是围绕适合他本人的需求去走的。

靳叔50多年的设计历程，兼顾了设计师与艺术家双重身份，并且到了后期将诸多精力放在了国画的研究上，已经是名副其实的画家，也圆了一直以来的梦想，在此期间获奖无数，个人荣誉加上靳与刘公司获得的奖项的高达500多项，成为香港当之无愧的设计教父，其中值得一提的有以下这些：


洛杉矶世界艺术比赛金奖

亚洲广告奖之最佳企业形象设计

波兰第一届国际电脑艺术双年展冠军

另外，在香港地区，靳叔更是以设计师身份获得以下荣誉：

1979，首位获选为香港十大杰出青年的设计师
1984，唯一获颁赠市政局设计大奖的设计师
1991，获香港艺术家年奖之设计师年奖
1992，被选为90年代风云男士之一

1999，获香港特区颁予铜紫荆星章勋衔
2001，获香港特区颁予银紫荆星章勋衔。


罗列完这些荣誉显然不可能，靳叔跟诸多大师一样，年长后将一部分精力放在扶持后辈的成长上，比方香港第四代设计师的代表人物李永铨就是师从靳叔，本来这期内容是计划一起聊聊这位“品牌医生”的，但碍于篇幅只能暂搁，靳叔也出版了诸多著作，比方平面设计实践》、《商业设计艺术》、《海报设计》、《广告设计》、《日本设计师对谈录》、我在前年也曾购买他的新书《设计心法100+1》，获益良多。

靳叔的故事还有很多，比方受李嘉诚邀约出任汕头大学长江艺术与设计学院院长，比方在1999年为热爱设计的年轻人创立了"靳埭强设计奖"，又比方跟美国著名设计大师保罗兰德（就是那个收乔布斯10万美元标志设计费，要求只出一个方案并且不修改的平面设计师大师）、跟日本平面设计之父龟仓雄策（关于他的故事可以详见上一期《日本的设计水平为什么高》）交往的故事等。

这些足以聊三集，但今天我们先聊到这里，有机会时候我们再来展开，并且提供更多靳叔的设计作品进行赏析。

 

最后补充一点靳叔的思想，其实靳叔在不同的场合跟著作当作都谈过不少他的创作理念，我在相对充分的了解后，针对泛数码设计的时代，觉得特别值得在这里跟大家分享的是：我们要做到“意在笔先”，就是创作前先要在我们的脑里产生好的创意，然后再借助电脑等工具将创意完全表现出来。对于现在许多做设计的年青人来说，离开了电脑就做不出东西，其实是很不健康的现象，真正好的作品饱含设计师的全部激情，这些仅靠电脑是远远不够的。“意在笔先”是中国传统使用工具的观念，无论用什么工具，笔或者电脑，或者将来有什么新的工具，做创作时，意在先，这是永恒的概念。

转自：站酷-设计史太浓

评论(0) 浏览(3309)

SS之盒子模型与背景属性————每天一遍小知识

seo达人

盒子模型与背景属性

一.盒子模型

1.介绍

  1. 元素的总宽度和总高度

    二.自定义边框——border

    1.基本设置

    2.边框宽度——Border Width

    3.边框颜色——Border Color

    4.边框样式——Border style

    5.CSS的边宽和高度——width height

    三.背景——background

    1.背景颜色——background color

    2.背景图像—— background image

    3.背景重复—— background repeat

    4.背景的附件（固定与滚动）——background attachment

    一.盒子模型

    1.介绍

    所有HTML元素都可以视为方框。

    CSS边框模型代表网站的设计和布局。

    它由边缘（margins），边框（ borders），内边距（paddings），和内容（content）组成的。

    这些属性以什么的顺序工作：top->right->bottom->left。





    小知识：



    网页的每个元素都是一个盒子（box）。 CSS使用盒子模型来确定盒子有多大以及如何放置它们。

    框模型还用于计算HTML元素的实际宽度和高度。
  2. 元素的总宽度和总高度

    （1）总宽度等于左右边缘，边框，边距相加：







    （2）总高度：上下相加





    二.自定义边框——border

    1.基本设置

    border属性允许您自定义HTML元素的边框。

    为了向元素添加边框，您需要指定边框的大小，样式，颜色。

    p {

       padding: 10px;    

       border: 5px solid green;

    }



    2.边框宽度——Border Width

    使用border-width属性可以 单独设置边框宽度



    p{

       padding: 10px;    

       border-style: solid;

       border-width: 2px;

    }



    3.边框颜色——Border Color

    可以使用颜色名称，RGB或十六进制值定义元素的边框颜色。



    p.first {

       padding: 10px;

       border-style: solid;

       border-width: 2px;

       border-color: blue;

    }



    小知识：除非设置border-style属性，否则所有border属性都不会起作用。



    4.边框样式——Border style

    默认值为none

    多种样式：dotted（点）, dashed（虚线）, double（双边框）等。

    p {border-style: none;}

    p {border-style: dotted;}

    p{border-style: dashed;}

    p{border-style: double;}

    p {border-style: groove;}

    p {border-style: ridge;}

    p{border-style: inset;}

    p{border-style: outset;}

    p {border-style: hidden;}







    5.CSS的边宽和高度——width height

    要设置<div>元素的总宽度和高度为100px：

    div {

       border: 5px solid green;    

       width: 90px;

       height: 90px;

    }



    框的总宽度和高度将为90px + 5px（边框）+ 5px（边框）= 100px；



    可以使用百分比 进行分配。

    div {

       border: 5px solid green;    

       width: 100%;

       height: 90px;

    }



    3.要设置元素的最小和最大高度与宽度，可以使用以下属性：



    min-width-元素的最小宽度

    min-height-元素的最小高度

    max-width-元素的最大宽度

    max-height-元素的最大高度

    p{

       border: 5px solid green;    

       min-height: 100px;       

    }



    三.背景——background

    1.背景颜色——background color

    background-color属性用来指定一个元素的背景色。



    列：



    body {

       background-color: #C0C0C0;

    }

    h1 {

       background-color: rgb(135,206,235);

    }

    p {

       background-color: LightGreen;

    }



    2.背景图像—— background image

    background-image属性中的元素可以设置一个或几个背景图像。

    URL指定路径的图像文件。相对路径和绝对路径均受支持。

    默认情况下，背景图像放置在元素的左上角，并在垂直和水平方向重复以覆盖整个元素。

    列;为<p>元素设置背景图片。



    p {

       padding: 30px;

       background-image: url("1.jpg");

       color: white;   

    }



    小知识



    要指定多个图像，只需用逗号分隔URL。



    3.背景重复—— background repeat

    repeat-x：图片延x轴复制

    repeat-y：图片延y轴复制

    Inherited：继承父级属性相同的指定值

    no-repeat:不重复，只有单个图片

    列：



    body {

       background-image: url("1.png");

       background-repeat: repeat-x;

    }

    p {

       background-image: url("1.png");

       background-repeat: inherit;

       margin-top: 100px;

       padding: 40px;

    }



    4.背景的附件（固定与滚动）——background attachment

    有效值



    fixed：固定背景图片

    scroll：向下滚动页面是，背景也随着滚动

    Inherit：继承

    列：



    body {

       background-image: url("1.png");

       background-repeat: no-repeat;

       background-attachment: scroll;

    }


评论(0) 浏览(3230)

设计萌芽与平面设计之父石汉瑞——香港设计史（上集）——【设计史太浓】

鹤鹤

你不知道，香港设计有位比教父更厉害的教父。

 

香港自古以来作为中国一部分，具有深厚的中国文化根源，但同时又历经156年的西方统治，注定其文化基因会产生特殊成分，这些文化特质体现在了流行曲、武侠小说、电影制作等诸多方面，都产生一定国际影响，而其中同样具有代表性的还有香港设计。

 

香港设计起步较晚，但发展突飞猛进，很快涌现出大批人才产生了国际影响力，成为“远东设计风貌”中的代表地区。而回归前夕，香港设计师也开始热衷频繁往返内地，与国内设计师或艺术院校进行学术交流，并且逐渐开展在内地的业务，对内地的设计风貌也产生一定的冲击。

 

而香港跟深圳在地缘上亲密无间，深圳近年被册封为中国设计之都，其地位来源与香港的影响有否关系呢？香港设计是如何走向国际的？香港设计对中国设计师又存在什么影响跟启发？香港设计发展到目前有否青黄不接？

 

带着这些有意思问题，我们一起来聊聊香港的现代设计。

我们在上一期聊日本设计时，谈到“远东平面设计风貌”，其实香港就是这种风貌的代表中心，不清楚这个风貌的朋友们可以去回顾一下设计史太浓栏目上一期内容：“日本的设计水平为什么那么高”。我们这里大致给出几张海报让大家感受一下。

香港的现代设计发展比内地要早大致20年光阴，也就是1960年左右启动，至今时间长达60年，期间出现大量优秀设计人才与优秀设计，屡屡斩获国际设计大奖，并且对于香港文化的推动，创意产业的提升，作出了诸多突出贡献。香港得以成为远东设计风貌的代表有几个重要原因，包括了地域、政府态度跟教育等。

 

但在叙述这些原因之前，我想先给大家来点地理知识的普及，就是什么叫“远东地区”？

 

远东其实是欧洲人的概念，是指以欧洲为中心后，东边的国家，所以远东前面就有了“近东”及“中东”了，中东地区因为物质资源太丰富，常年战争不断所以比较知名，近东极少听，远东是随着亚洲几个国家的崛起所以颇为知名。

远东传统意义上包含的国家有：中国（当然包含了港澳台）、朝鲜、韩国、日本、蒙古、菲律宾、越南、新加坡、俄罗斯东部等等。而需要强调的是，设计圈里谈远东风貌一般不含日本，原因是日本设计足够厉害可以独立成项了，好比一个明星组合里某个成员爆红，独立单飞的情况一样。

 

而香港平面设计，在国际印象中，也基本满足单飞的条件，当然我说的仅仅是平面设计。我们将话题回到形成这个情况的原因，看看有否值得内地设计圈学习借鉴的地方。


1） 地域

 

香港沿海地区非常多，并且地理上处于亚洲心脏地带，交通优势非常明显，通常也被视为通过中国内地的一个门户，于是成为了内地、日本、韩国、东南亚、美国及泛太平洋地区交流的中心。

 

而且香港过去被英国统治了一个多世纪，让市民都兼备两种文化血统，精通中英文，并且对世界各地的文化时尚有足够的包容度，随着商业发展与经济腾飞，香港人也习惯让子女海外留学，这个留学群体就包含了大量设计师，留学归来的设计师带来诸多国际化设计语言，同时也吸引一部分优秀设计师来港发展，这一块我们后面将会详细描述。


2）政府态度 

 

60年代开始，香港旅游业开始兴起，大量国际友人访港，于是1966年香港政府就成立了“香港贸易发展局”，跟当时的香港平面设计发展处在同一个时间，这个机构的职能主要是向世界推广香港，由此就产生了大量的设计需求，并且香港政府有意借助设计为推广手段，重视设计的环节与效果，促使香港设计风格的逐步形成，这种风格就类似日本的双轨制，既有东方韵味又符合国际主流。

 

香港第一代设计师也由此开始出现。其中包括了王无邪、石汉瑞、靳埭强、施养德、高文安、周志波、张树新、郭乐山等人。


香港政府对于设计的价值是深信不疑的，所以香港回归后， 在2001年成立了“香港设计中心“，这个机构获得特区政府鼎力支持，目的是推动香港成为具备高度竞争力及享誉国际的设计资源中心，除了设计技能的提升技巧与设计思想的交流外，香港设计中心也考虑到设计产业所需的相关技能，比方财经、市场推广、设计生产的管理等，常年举办讲座、展览、赛事等活动，并且通过媒介宣传香港设计，鼓励大家参与并重视设计，所以对香港设计又产生了一次非常重大及有意义的推动。

 

这一点，有点类似美国设计，香港设计对商业的重视程度非常高，但同时力求在艺术上找到恰当的平衡，关于美国设计，可以回顾设计史太浓之前的《商业设计祖师爷-美国设计》。


3）教育

 

由于政府对设计创意产业的重视，教育上也同步获得了体现，60年代末香港就开始出现设计专业大学，跟香港设计同步发展，香港设计教育非常专业，开放性强，多元化，并且前沿而务实。

香港设计大学集合了诸多优秀师资，以全英文方式授课，由于地域的优势，可以获取到国际的专业教学资料，还经常聘请国际一流的商业设计师来做客座教授，带来世界前沿的设计资讯，提供大量水平优质的选修课，这种教学配置及质量让香港的设计专业学生毕业后在国际上具有全方位技能及竞争力，从而良性促进香港平面设计的发展。

对于香港设计大师，内地熟知的主要是靳埭强、陈幼坚跟李永铨等，而有一位比前面诸位辈分更高的香港设计奠基人却不太被人谈论，好比一谈香港栋笃笑首先想到黄子华，而忽略了开山鼻祖许冠文一般。

 

这位大师有着纯正中国名字却并非中国人，这也是让他在内地不够知名的其中一个原因，他生于奥地利，在美国学习设计，法国深造，最后扎根香港发展，他就是在香港设计圈里鼎鼎大名，被公认为香港平面设计之父，类似黑帮里“啊公”这种级别的石汉瑞先生。

石汉瑞1934年出生于奥地利的维也纳，5岁移居美国，在纽约度过了他的青少年时期，成年后在纽约市立Hunter学院学习设计，毕业后去了耶鲁大学攻读艺术硕士，读完再去法国巴黎深造，所以石先生属于超高学历类型的设计师，期间他师从美国“纽约派”大师保罗·兰德及包豪斯1925年毕业留校的鼎鼎有名的设计大师赫伯特·拜耶，所以石汉瑞先生严格来说，其实属于包豪斯血统比较纯正的第三代传人。按辈分来说，他跟在哈佛学习的贝律铭先生（著名华裔建筑师）是同属一个辈分的。

 

石汉瑞来港发展也算机缘巧合，1961时27岁的他受香港《亚洲杂志》的邀请，担任设计总监，从而开始他的平面设计职业生涯，其时朝鲜战争结束不久，美国此前为了方便从亚洲市场获得物资储备，对日本、韩国以及中国台湾和香港地区所推行的政策是大力扶持其工商业的发展，有了这个前提，香港工商业逐渐兴起，而香港设计与其同步获得发展。由此也可以发现，所以很多大师的诞生都会基于一些社会变革的背景。


在《亚洲杂志》工作了不到4年的石汉瑞，在1964年30岁时独立创业，创办品牌创建与战略咨询公司，以企业形象设计为主要业务，开展全方位、多领域的平面设计工作，是香港最早推行企业形象设计的第一人。而当时香港人对于什么是现代设计，仍然一片模糊。

 

石汉瑞的代表作非常多，而且合作的都是大牌客户，首当其冲的就是当时的港英政府，比方石汉瑞设计了香港赛马会标志、汇丰银行标志，甚至是渣打银行发行的港币设计。70年代的石汉瑞在香港设计界已经是如日中天，有非常权威的地位。

0年代初，也许因为在《亚洲杂志》任职的缘故，当时的石汉瑞就已经在不断研究将东方传统文化与现代设计进行结合，在香港开创了跨文化设计的先河。对后来的靳埭强及陈幼坚产生巨大的帮助作用。

 

独立创业后的石汉瑞更是将这种跨文化设计风格发挥到了，前后服务了上百家香港大型企业或机构，石汉瑞平面设计作品的三个主要的特征分别是：创造性的字体设计、独特的实物与文字结合、跨文化的图像结合。而他几乎所有服务香港的作品都基本包含一种设计语言，就是东西文化相互交流与融合中保持一种独特的跨文化风格，比方下面这些作品：


石汉瑞运用中信泰富的英文字母“CITIC”进行创作，采用中西融合的方式将五个字母设计成中国传统灯笼的造型，同时又与企业中文名称的“中”相呼应，寓意着吉祥、信赖以及积极向上的企业经营理念，鲜红的标准色则象征着旺盛的生命力，可谓巧妙之极，浑然天成。


如果要在此讲述完石汉瑞的全部代表作并不可能，所以大致展示了一些可以说明其风格的作品，石汉瑞在香港的成就是公认的，但是石汉瑞虽然擅长做出东方韵味或者中西结合的作品，但他其实完全不懂中文，这是一件颇为神奇的事情，类似的情况还有最知名的中国绘画史是美国作家高居翰（James Cahill）完成的这件事情。

 

1972年，38岁的石汉瑞主力参与发起香港设计师协会的成立，1975年41岁的他被选为香该协会主席。同时石汉瑞还是国际平面设计联盟（AGI）中唯一代表香港的会员。

2004年时，已经70岁的石汉瑞获得了香港浸会大学（Hong Kong Baptist University）荣誉博士学位，他还曾多次获得国际奖项，包括亚欧基金商标奖、日本创意 （Idea） 杂志世界大师等称誉，以及被国际平面设计协会联合会（ICOGRADA）评为20世纪设计大师。2006年（72岁）奥地利政府为了表彰他对香港和奥地利两地所做出的巨大贡献，授予他金级荣誉勋章。

设计之余，石汉瑞也非常热心于香港的设计教育，60岁过后，出版了诸多重要的设计书籍，比方《跨文化设计—国际市场的沟通及交流》，如今已经84岁的石汉瑞先生仍然定居于香港，但是一般的活动已经鲜见其现身。

转自：站酷-设计史太浓 

评论(0) 浏览(4388)

也许是2020年全网最全的关于iOS、Android设计规范、适配总结文章

鹤鹤

本文6000字上下，反复校对6遍以上，初步阅读完大概需要25分钟，若是深入理解并完全吸收则建议“先收藏再反复的品，细细的品”。希望对各位朋友有所帮助，不足之处望校正，祝阅读愉快。


双20年终究还是来了，互联网产品对于这个时代不是什么新鲜事了，互联网人也从未停止对优秀产品的探索和创新。而做为一个设计人的我们，在前行的脚步中也应该温故知新，就让我跟大家一起来对iOS、Android的设计规范、适配问题做一次全面的梳理和复习吧。



iOS设计规范


苹果自07年1月9日正式发布iPhone到目前为止的iPhone11Pro Max，已经历了十三代产品。19年9月11日推出的11、11Pro、11Pro Max并没有新增尺寸，所以对设计师而言也就没有额外新增工作量了，还是按照以前的做法：750*1334px（@2x）或（375*667pt，@1x）做设计稿，再提供@2x、@3x切图。


以下为苹果手机历代产品明细（话说你拥有过那几代产品，欢迎留言交流）

一代：iPhone

二代：iPhone3G

三代：iPhone3GS

四代：iPhone 4

五代：iPhone 4s

六代：iPhone 5

七代：iPhone 5s、iPhone 5c

八代：iPhone6、iPhone6 Plus

九代：iPhone 6s、iPhone 6s Plus

十代：iPhone7、iPhone7 Plus

十一代：iPhone8、iPhone8 Plus、iPhone X

十二代：iPhone XS、iPhone XS Max、iPhone XR

十三代：iPhone11、iPhone11Pro、iPhone11Pro Max


如何有效记住iOS设计规范，这里我总结了一个方法“iOS五点两图记忆法”，也就是五个点+两张图。


1、设计尺寸：375x667pt @1x（750x1334px @2x）为基准设计。

2、设计工具：Sketch、Adobe XD、Photoshop

3、预览效果：Sketch Mirror、Adobe XD或Ps Play

4、切图输出：@2x @3x两套

5、标注工具：蓝湖，摹客

两图psd下载链接：https://pan.baidu.com/s/15g2x0vDd1yZevADuUj1V3g 提取码: i4ai


考考你：

1、iPhone8尺寸的设计稿如何快速变成iPhoneX的设计稿？

2、@2倍图被当作@3倍进行开发，会导致什么样的后果？

3、为什么要用375x667pt @1倍图进行设计？（后文也有详细答案哦）

4、iPhone8显示为34px的文字在iPhone11 pro Max里面是不是也是34px？


这里我们首先重点理解下PX和PT这两个单位， 弄清楚为什么建议使用一倍图进行UI设计，才能在设计中以不变应万变。（说明：该部分内容优化自静电老师的总结。公众号@静Design）


PX大家可能比较熟悉，就是像素，英文pixel的简称。最通俗的理解就是找一个放大镜（不是电脑中的放大镜，是真实的放大镜），然后对准自己面前的显示器或者手机屏幕观看，大部分显示器会在放大镜下出现一个个点。这就是我们平时所说的像素概念。在一台物理分辨率为1080x1920px的显示器中，横向分布1920个点，纵向则有1080个点。这些点通过显示器的光学特性，为我们组成不同的图像。



请注意， 在不同尺寸的显示器上，这些点的单位面积并不是一样的。比如一台22英寸的1080p液晶显示器与一台27英寸的1080p液晶显示器，可以发现这两台显示器的像素分布就是27英寸的显示效果明显逊于22英寸显示器的效果，一个重要的原因就是两台液晶面板中的“像素”颗粒大小不一。


由此可见，像素这个单位是一个相对单位，不能用厘米、毫米等这些绝对度量单位来衡量他的长度或者宽度，因为1像素只代表一个单位的“点”。


另一个重要单位是PT，英文point的简称，这个单位也是iOS开发过程中使用的单位，与px这样的相对单位不同，PT（Point）是一个绝对单位，中文名字是“磅因（或者磅）”（1PT=1/72英寸）。


同样用简单直观的例子来演示，拿两台不同型号的iPhone，比如一台ip11和一台ip11pro Max，打开同样一款应用（如QQ音乐），准备好一把尺子，使用尺子分别测量最上方title“音乐馆”文字尺寸。经测量，可以发现不同型号的“音乐馆”文字的尺寸都一样。也可以请iOS开发人员分别写两个针对不同尺寸机型适配的同一个文件，并在两部手机安装，确保这个文件中的字体使用一个字号（30PT）。在两个手机中运行并用尺子测量，我们发现他们的物理尺寸完全一样。



请大家记住一点，px是相对单位，pt为绝对单位（类似单位为厘米，毫米等等）。在不确定屏幕密度的情况下，px与pt没有任何可比性。


在开发工程师眼中，你如果使用750px的分辨率作图，那么按原大小标注设计稿中的尺寸的话，他们同样在开发环境中是要换算为一倍尺寸的，比如你标注了字号为40px，那么最终开发工程师写在代码里的就是20pt，除以2的关系。但是呢，如果使用一倍基准分辨率作图，那么就不用除以2啦，所有尺寸开发工程师直接拿过去随取随用。


sketch作为一款纯矢量的移动端ui设计软件，不管是设计还是后期与开发工程师的配合，都严格遵从开发原理，这种设计方法可以最大限度保证设计稿的复现，同时也可以减小文件体积和系统资源消耗，不管是从哪个方面看，都是设计师制作ui界面的明智之选。


最后总结一下原因，设计师使用一倍基准尺寸作图，主要是单位转换方便，输出切图方便，理解简单。对于工程师，他们不用再进行复杂的换算，有助于完美复现设计稿。





我们继续熟悉iOS中一些必不可少的页面规范细则。



一、引导页


引导页是一张完整图，不能适配，因此需要单独出设计图，iOS共需提供6套尺寸，当然也支持视频形式。（目前5以下的适配基本淘汰）



二、图标


以1024x1024px尺寸进行图标创作即可。再通过现成尺寸模版资源，一键生成整套尺寸导出即可。（模版链接：https://developer.apple.com/design/resources/Template-AppIcons-iOS）


注意：最终提交给到程序员的切图是直角，非圆角图标。





设备名称
应用图标
App Store                 图标
Spotlight                 图标
设置图标
iPhone11P, 11P Max, X, Xs, 8P , 7P , 6s P , 6P 
180 x 180 px 
1024 x 1024 px 
120 x 120 px 
87 x 87 px 
iPhone11, XR, 8, 7, 6s, 6, SE，5s, 5c, 5,4s, 4 
120 x 120 px 
1024 x 1024 px 
80 x 80 px 
58 x 58 px 
iPhone 1, 3G, 3GS 
57 x 57 px 
1024 x 1024 px 
29 x 29 px 
29 x 29 px 
iPad Pro 12.9, 10.5 
167 x 167 px 
1024 x 1024 px 
80 x 80 px 
58 x 58 px 
iPad Air 1 & 2, Mini 2 & 4,3 & 4 
152 x 152 px 
1024 x 1024 px 
80 x 80 px 
58 x 58 px 
iPad 1, 2, Mini 1 
76 x 76 px px 
1024 x 1024 px 
40 x 40 px 
29 x 29 px 

其他设备图标尺寸


三、状态栏和导航栏（具体尺寸见五点二图）


状态栏：显示时间、运营商信息、电池电量等信息区域。(齐刘海区域)

导航栏：状态栏下面的区域，含页面标题、功能图标等信息区域。

状态栏跟导航栏一般会进行一体化设计。现在流行大标题导航栏设计，也就是加大导航栏的高度，融入页面内容的标题，当内容上滑时，大标题再回归到常规导航高度。（大标题导航栏的高度一般为116pt（232px），这里包括了20pt（40px）状态栏的高度，同时也能放得下34pt（68px）的大标题和辅助信息（如返回等图标）。


undefined


导航栏中的元素必须遵守如下几个对齐原则:

1、返回按钮必须在左边对齐。

2、当前界面的标题必须在导航栏正中。（可无）

3、其他控制按钮必须在右边对齐。



四、标签栏（具体尺寸见五点二图）


标签栏：即Tab栏，为底部快速入口，iOS规范中Tab栏一般有五个、四个、三个图标的形式。分为“纯图标标签”和“图标加文字标签”两种形式。


undefined



五、iTunes 上传页面


在程序上传App Store时我们需要提供多张App截图，供用户了解APP的功能。这里我们需要提供1242 x 2688px和1125 x 2436px两套截图。也支持视频形式。（微信目前采用的是五张静态页面形式）


微信iTunes上传用截图 



六、 字体


中文字体：PingFang SC，英文字体：SF UI Text 、SF UI Display，其中SF UI Text适用与小于19pt的文字，SF UI Display适用于大于20pt的文字。

链接: https://pan.baidu.com/s/17cKM9co53TEN85gj4vy5dw 提取码: hd35



七、色彩


在iPhone上显示的色域要比我们作图时的RGB色域要广。所以在iPhone上设计怎样的颜色都可以，只要符合产品气质并且在色彩心理学理论范围内。官方建议的系统色彩如下：

iPhone的系统色



八、控件


控件包括：输入框、按钮、滑杆、页卡、开关等，在设计模板中已经全部列出。（下载地址：https://developer.apple.com/design/resources/）为了让设计更符合整体产品品牌调性，这些控件可以做二次设计。


但得注意两件事：第一，点击区域基本符合44pt（88px）原则，也就是在手机上大小大概是7mm-9mm，适合手指点击。第二，要设计操作的不同状态，不要只设计一种状态。

默认控件



控件中无处不在的44pt（88px）

之前我们介绍过，人手指点击区域为7mm - 9mm，在@2x中就是44pt（88px）。苹果的导航条、列表、工具栏都充满了44pt（88px）这个神秘数字。我们在设计时一定也要考虑到手指的点击区域。


 无处不见的44pt（88px）



九、界面设计原则


1.边距和间距（@2x）

在移动端页面的设计中，页面中元素的边距和间距的设计规范是非常重要的，一个页面是否美观、简洁、通透和边距、间距的设计规范紧密相连。


（1）全局边距（iOS13，@2x）

全局边距是指页面内容到屏幕边缘的距离，整个应用的界面都应该以此来进行规范，以达到页面整体视觉效果的统一。在实际应用中应该根据不同的产品气质采用不同的边距，让边距成为界面的一种设计语言，全局边距的设置可以更好的引导用户竖向向下阅读。还有一种是不留边距，通常被应用在卡片式布局中图片通栏显示，这种图片通栏显示的设置方式，更容易让用户将注意力集中到每个图文的内容本身。


undefined

iOS原生态页面“设置”和“通用”页面的边距都是40px。（@2x） 





微信和支付宝的边距都是32px。（@2x）



（2）卡片间距

在移动端页面设计中卡片式布局是非常常见的布局方式，至于卡片和卡片之间的距离的设置需要根据界面的风格以及卡片承载信息的多少来界定，通常最小不低于16px，过小的间距会造成用户紧张情绪，使用最多的间距是20px、24px、30px、40px，当然间距也不宜过大，过大的间距会使界面变得松散，间距的颜色设置可以与分割线一致，也可以更浅一些。


以iOS（750*1334px）为例，设置页面卡片间距为70px，而通知中心承载了大量的信息，因此采用了较小的16px作为卡片的间距。



总结：卡片间距的设置是灵活多变的，一定要根据产品的气质和实际需求去设置，平时也可以多截图测量一下各类APP的卡片间距都是怎么设置的，看的多了并融会贯通，卡片间距设置自然会更加合理，更加得心应手。



（3）内容间距

一款APP除了各种栏（状态栏、导航栏、标签栏、工具栏）和控件icon，就是内容了，内容的布局形式多种多样，这里不去探讨内容具体应该如何去布局，我们来说一说内容的间距设置问题。



格式塔邻近性原则：

单个元素之间的相对距离会影响我们的感知，互相靠近的元素看起来属于一组，而那些距离较远的则自动划分组外。来看下图，左图中的圆在水平方向比垂直距离近，那么，我们看到了4排圆点，而右图则看成4列。

在UI设计中内容布局时，一定要重视邻近性原则的运用 


2.内容布局

在APP的设计中内容的布局形式多种多样，这里介绍最常用的两种布局形式，列表式布局和卡片式布局。


（1）列表式布局

列表式布局方式非常普遍，随便打开一个APP，基本都存在这种布局方式。特点在于能够在较小的屏幕中显示多条信息，用户通过上下滑动的手势能获得大量的信息反馈。这也是一种非常容易理解的展示形式。


（2）卡片式布局

这种布局形式相对灵活。其特点在于每张卡片的内容和形式相互独立，互不干扰，所以可以在同一个页面中出现不同的卡片承载不同的内容。卡片式布局相对时尚、前卫，很多to C产品经常用到。另外，双栏卡片的布局形式，也常见于以图片信息为主导的App，例如一些商城的商品陈列页面。这种形式能在一屏里显示更多的内容（至少4张），同时，由于分开左右两栏的显示，用户可以更加方便地对比左右两栏卡片的内容。



3.界面图片设计比例

在UI设计中，对于图片的尺寸和比例没有严格的规范，设计师往往凭借经验和感觉设置一个看起来不错的尺寸，但事实上我们是有章可循的。运用科学的手段设置图片的尺寸，可以获得最优的方案，常见的图片尺寸有16:9、4:3、3:2、1:1和1:0.618（黄金比例）等。



4.APP版式设计规范

版式设计又叫做版面编辑，即在有限的版面空间里，将版面的构成要素（文字、图片、控件）根据特定的内容进行组合排列。一个优秀的排版要考虑到用户的阅读习惯和设计美感，在UI设计中版面设计的基础原则有哪些呢？


（1）对齐

对齐是贯穿版式设计最基础，最重要的原则之一，它能建立起一种整齐规矩的外观，带给用户有序一致的浏览体验。


（2）对称

对称是对立统一规律的本质属性，呈现出一种和谐自然的美，在应用界面的设计中，引导页设计、注册登录输入框和按钮等无一不是对称的设计。


（3）分组

物以类聚，人以群分。分组是将同类别的信息组合在一起，直观的呈现在用户面前，这样的设计能够减少用户的认知负担，在移动端界面的设计中最常见的分组方式就是卡片，为用户选择提供专注而又明确的浏览体验。



十、切图命名规范


切图最后需要命名成规范格式，方便程序员查找。切图命名的格式建议全英文，如果大家英文不好需要想办法提升一点简单的词汇量。借由上述工具切图后，需要整理切图命名，或在切图之前对图层命名亦可。以下是切图元素的中英文对照：


 

切图命名对照表

 

然后我们要按照”功能_类型_名称_状态@倍数”来命名每个切图，比如我们导航条上有一个搜索图标，那么它的名称就是： 

navi_icon_search_default@2x.png

(导航_图标_搜索_正常@2x.png)






Android设计规范



接下来，再一起来看看Android设计规范，这里只是把安卓规范中一些关键信息做了汇总，更详细的不过多赘述，网上已经有很多大佬产出过此类文章，大家可自行搜索。



一、安卓开发单位是DP、SP


DP：安卓专用长度单位。

以160 DPI屏幕为标注，则1DP=1PX

计算公式：dp x dpi/160=px

例：以720x1280px （320dpi）为例， 1dp x 320 dpi/160=2px


SP：安卓专用字体单位。

以160 DPI屏幕为标注，则1SP=1PX

计算公式：sp x dpi/160=px

例：以720x1280px （320dpi）为例， 1sp x 320 dpi/160=2px



二、安卓设计尺寸：以1080x1920px作为设计稿标准尺寸


1.从中间尺寸向上、下适配，界面调整幅度最小，最方便适配。

2.大屏幕时代依然以小尺寸作为设计尺寸，会限制设计师的设计视角。

3.用主流尺寸来做设计稿尺寸，极大的提高了视觉还原和其他机型适配。


三、安卓图标尺寸




四、安卓字体


中文：思源黑体 / Noto Sans Han

英文：Roboto

大小：主题文字 36-34px    正文 28-26px     提示文字 24-22px

链接: https://pan.baidu.com/s/17cKM9co53TEN85gj4vy5dw 提取码: hd35



五、切图规范


1.切图尺寸必须为双数

2.单像素的图会出现边缘模糊的情况

一般情况下，我们只需要提供3套切图资源就可以满足安卓工程师的适配，分别是HDPI、XHDPI、 XXHDPI 3套切图资源。





如何用iOS的设计稿适配安卓


现在绝大多数公司限于人力物力的限制，不能把iOS和安卓的设计稿全部执行出来，因此就存在一稿两用的情况；设计师以iOS版本的设计稿来适配安卓，下面我们来看一组有趣的数学换算题：

1080/1.5=720，720/1.5=480，1242*2208/1.15=1080*1920，也就是说，1242*2208（iOS@3倍尺寸）与1080*1920（安卓尺寸）是可以等比缩放的，所以，iOS与Android的尺寸是可共用1242*2208px。因此，以iOS设计尺寸进行设计是可以适配Android的。（前提是必须和安卓工程师沟通清楚）


另一种方式，就是把750×1334px等比例调整尺寸到安卓1080×1920px，对各个控件进行微调，重新提供标注（用dp标注）。也就是需要提供两套标注，一套给iOS，一套给Android。


iOS开发语言


作为iOS开发工程师，最重要的三个工具是：Obiective-C、Swift、UIKit框架。Obiective-C是目前最有效率的语言；而Swift开发非常。一般iOS工程师会在这两个语言中选择一种作为开发工具。UIKit是苹果系统自带的一套框架，这个框架里有设置按钮、滑竿、状态栏、电池电量、键盘等接口可供调用。所以我们看到很多第三方APP的界面中，有许多控件和苹果自带程序是一致的，这就是UIKit的功劳。


iOS开发里单位是pt


750×1334尺寸的换算关系 1pt=2px，也就是说程序员拿到我们的px单位的标注稿，自己除以2就是pt了。（这也是为什么建议设计师用@1倍图做设计稿的原因）

转自：站酷-蜗牛和笔

评论(0) 浏览(4108)

分类

日历

链接

个人资料

蓝蓝设计的小编 http://www.lanlanwork.com

存档