<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
		>
<channel>
	<title>Comments on: 设计系列：Draware是怎么炼成的（1）</title>
	<atom:link href="http://www.shimuuu.com/blog/design-series-draware-concept-mobile-ui-design/feed" rel="self" type="application/rss+xml" />
	<link>http://www.shimuuu.com/blog/design-series-draware-concept-mobile-ui-design</link>
	<description>诗沐的设计博客和作品集。提供网页设计/开发/用户体验咨询/wordpress博客主题设计等服务。记录网页设计&#38;开发教程，发布wordpress主题。</description>
	<lastBuildDate>Fri, 03 Sep 2010 03:20:44 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
		<item>
		<title>By: Draware概念手机界面的flash演示 &#171; Shimu design &#8211; 网页设计 前端开发 用户体验 wordpress博客主题</title>
		<link>http://www.shimuuu.com/blog/design-series-draware-concept-mobile-ui-design/comment-page-1#comment-244</link>
		<dc:creator>Draware概念手机界面的flash演示 &#171; Shimu design &#8211; 网页设计 前端开发 用户体验 wordpress博客主题</dc:creator>
		<pubDate>Thu, 22 Apr 2010 16:41:34 +0000</pubDate>
		<guid isPermaLink="false">http://iamfrompluto.cn/2009/08/06/%e8%ae%be%e8%ae%a1%e7%b3%bb%e5%88%97%ef%bc%9adraware%e6%98%af%e6%80%8e%e4%b9%88%e7%82%bc%e6%88%90%e7%9a%84%ef%bc%881%ef%bc%89/#comment-244</guid>
		<description></description>
		<content:encoded><![CDATA[<p>[...] 之前有写过记录这个概念手机界面设计过程的系列网志（还没完成全部），已完成两篇：Draware手机界面设计和设计系列：Draware是怎么炼成的（1）。如果你感兴趣可以订阅我的博客，我会尽早完成这个系列网志，到时就能在RSS中看到。 [...]
<div class="comment-remix-meta"><a href="#" class="replyto" onclick="replyto('244','Draware&aelig;&brvbar;&aring;&iquest;&micro;&aelig;&aelig;&ordm;&ccedil;&eacute;&cent;&ccedil;flash&aelig;&frac14;&ccedil;&curren;&ordm; &amp;laquo; Shimu design &amp;#8211; &ccedil;&frac12;&eacute;&iexcl;&micro;&egrave;&reg;&frac34;&egrave;&reg;&iexcl; &aring;&ccedil;&laquo;&macr;&aring;&frac14;&aring; &ccedil;&uml;&aelig;&middot;&auml;&frac12;&eacute;&ordf; wordpress&aring;&aring;&reg;&cent;&auml;&cedil;&raquo;&eacute;&cent;'); return false;">Reply</a> </div>
]]></content:encoded>
	</item>
	<item>
		<title>By: jy</title>
		<link>http://www.shimuuu.com/blog/design-series-draware-concept-mobile-ui-design/comment-page-1#comment-98</link>
		<dc:creator>jy</dc:creator>
		<pubDate>Tue, 09 Feb 2010 14:24:46 +0000</pubDate>
		<guid isPermaLink="false">http://iamfrompluto.cn/2009/08/06/%e8%ae%be%e8%ae%a1%e7%b3%bb%e5%88%97%ef%bc%9adraware%e6%98%af%e6%80%8e%e4%b9%88%e7%82%bc%e6%88%90%e7%9a%84%ef%bc%881%ef%bc%89/#comment-98</guid>
		<description>“下一篇预告，具体页面的设计。包括视觉的细节和页面具体的交互。”——这篇在哪里？&lt;div class=&quot;comment-remix-meta&quot;&gt;&lt;a href=&quot;#&quot; class=&quot;replyto&quot; onclick=&quot;replyto(&#039;98&#039;,&#039;jy&#039;); return false;&quot;&gt;Reply&lt;/a&gt; &lt;/div&gt;</description>
		<content:encoded><![CDATA[<p>“下一篇预告，具体页面的设计。包括视觉的细节和页面具体的交互。”——这篇在哪里？
<div class="comment-remix-meta"><a href="#" class="replyto" onclick="replyto('98','jy'); return false;">Reply</a> </div>
]]></content:encoded>
	</item>
	<item>
		<title>By: gundam215</title>
		<link>http://www.shimuuu.com/blog/design-series-draware-concept-mobile-ui-design/comment-page-1#comment-15</link>
		<dc:creator>gundam215</dc:creator>
		<pubDate>Fri, 07 Aug 2009 12:11:39 +0000</pubDate>
		<guid isPermaLink="false">http://iamfrompluto.cn/2009/08/06/%e8%ae%be%e8%ae%a1%e7%b3%bb%e5%88%97%ef%bc%9adraware%e6%98%af%e6%80%8e%e4%b9%88%e7%82%bc%e6%88%90%e7%9a%84%ef%bc%881%ef%bc%89/#comment-15</guid>
		<description>
就是赋予了过多的意义，过多的行为，进行了过多的雕琢。
本身这种行为映射的想法很好。
但是仔细看图上手和icon的比例，实际上一个手指头就覆盖住了整个icon，手指一放下去已经把图标盖住了。这后续的细节操作就显得很多余。另外可行性上也出现了问题。精确度要求更高了，把一个icon分成了两个感应区域，也就是分到了两个控件上，增加了复杂度。
仔细再抽象一下，实际上这个概念就是，第一下focus，第二下enter。在windows上为单击和双击的差别，在普通按键手机上，靠方向键＋enter键分为两步。单击选中，双击打开，而drag&amp;drop进行拖动。（我比较赞赏这种设计，因为真正做到了没有东西可以再减）。所以我觉得一定得看一下《designing interaction》，看看第一代GUI OS——STAR，设计这些交互原型的原因。
另一方面还要思考一下用户反应时间，缓冲时间一秒这属于我们作为设计师的主观推测。实际上国外在这些方面做过一些统计《GUI设计禁忌》有一章专门讲这些的（那本书里唯一值得一看的一章）&lt;div class=&quot;comment-remix-meta&quot;&gt;&lt;a href=&quot;#&quot; class=&quot;replyto&quot; onclick=&quot;replyto(&#039;15&#039;,&#039;gundam215&#039;); return false;&quot;&gt;Reply&lt;/a&gt; &lt;/div&gt;</description>
		<content:encoded><![CDATA[<p>就是赋予了过多的意义，过多的行为，进行了过多的雕琢。<br />
本身这种行为映射的想法很好。<br />
但是仔细看图上手和icon的比例，实际上一个手指头就覆盖住了整个icon，手指一放下去已经把图标盖住了。这后续的细节操作就显得很多余。另外可行性上也出现了问题。精确度要求更高了，把一个icon分成了两个感应区域，也就是分到了两个控件上，增加了复杂度。<br />
仔细再抽象一下，实际上这个概念就是，第一下focus，第二下enter。在windows上为单击和双击的差别，在普通按键手机上，靠方向键＋enter键分为两步。单击选中，双击打开，而drag&amp;drop进行拖动。（我比较赞赏这种设计，因为真正做到了没有东西可以再减）。所以我觉得一定得看一下《designing interaction》，看看第一代GUI OS——STAR，设计这些交互原型的原因。<br />
另一方面还要思考一下用户反应时间，缓冲时间一秒这属于我们作为设计师的主观推测。实际上国外在这些方面做过一些统计《GUI设计禁忌》有一章专门讲这些的（那本书里唯一值得一看的一章）
<div class="comment-remix-meta"><a href="#" class="replyto" onclick="replyto('15','gundam215'); return false;">Reply</a> </div>
]]></content:encoded>
	</item>
	<item>
		<title>By: gundam215</title>
		<link>http://www.shimuuu.com/blog/design-series-draware-concept-mobile-ui-design/comment-page-1#comment-14</link>
		<dc:creator>gundam215</dc:creator>
		<pubDate>Fri, 07 Aug 2009 12:11:20 +0000</pubDate>
		<guid isPermaLink="false">http://iamfrompluto.cn/2009/08/06/%e8%ae%be%e8%ae%a1%e7%b3%bb%e5%88%97%ef%bc%9adraware%e6%98%af%e6%80%8e%e4%b9%88%e7%82%bc%e6%88%90%e7%9a%84%ef%bc%881%ef%bc%89/#comment-14</guid>
		<description>本身draware这种行为映射，语义同化的想法很好。

但是仔细看图上手和icon的比例，实际上一个手指头就覆盖住了整个icon，手指一放下去已经把图标盖住了。（没看到视频，我判断失误）这后续的细节操作就显得很多余。另外可行性和可用性上也出现了问题。精确度要求更高了，把一个icon分成了两个感应区域，也就是分到了两个控件上，还增加了制作复杂度。drag&amp;drop增加了用户操作复杂度。

仔细再抽象一下，实际上这个概念就是，第一下 focus，第二下enter。在windows上为单击和双击的差别，在普通按键手机上，靠方向键＋enter键分为两步。单击选中，双击打开，而 drag&amp;drop进行拖动。（我比较赞赏这种设计，因为真正做到了没有东西可以再减）。所以我觉得一定得看一下《designing interaction》，看看第一代GUI OS——STAR，设计这些交互原型的原因。（第一章就是介绍鼠标，为什么要用鼠标？很大程度上就是为了精确度，单点控制，【而触摸屏的技术则叫做多点触摸】）

这里就可以发现触摸操作和鼠标操作的考虑模式就不同了，这个icon的交互行为实际上是对鼠标精确操作中的drag&amp;drop与我们日常操作行为进行了拼合，嫁接到了手指触摸这种模糊操作。这个地方如果进行简单的移植，而不重新思考和定义细节（从部件的感应域，到触发事件，到交互行为，到回馈都要重新定义，所以要做交互一定要学前端开发），就会出现这种过度设计。

（插播：我自己设计的过程中，基本不会用drag&amp;drop这种行为进行开关、选择性质的操作，这种行为我觉得是专门适用于定位和组织的，比如我以前介绍过的iamlin的这个实验性个站，我觉得它这个实验立意太浅了，开题的角度和应用都没有学弟的draware有深度，因为学弟在icon的操作上已经做到了语义同化。关于drag&amp;drop我在交互的两个方向中详细介绍过我的观点。）&lt;div class=&quot;comment-remix-meta&quot;&gt;&lt;a href=&quot;#&quot; class=&quot;replyto&quot; onclick=&quot;replyto(&#039;14&#039;,&#039;gundam215&#039;); return false;&quot;&gt;Reply&lt;/a&gt; &lt;/div&gt;</description>
		<content:encoded><![CDATA[<p>本身draware这种行为映射，语义同化的想法很好。</p>
<p>但是仔细看图上手和icon的比例，实际上一个手指头就覆盖住了整个icon，手指一放下去已经把图标盖住了。（没看到视频，我判断失误）这后续的细节操作就显得很多余。另外可行性和可用性上也出现了问题。精确度要求更高了，把一个icon分成了两个感应区域，也就是分到了两个控件上，还增加了制作复杂度。drag&#038;drop增加了用户操作复杂度。</p>
<p>仔细再抽象一下，实际上这个概念就是，第一下 focus，第二下enter。在windows上为单击和双击的差别，在普通按键手机上，靠方向键＋enter键分为两步。单击选中，双击打开，而 drag&#038;drop进行拖动。（我比较赞赏这种设计，因为真正做到了没有东西可以再减）。所以我觉得一定得看一下《designing interaction》，看看第一代GUI OS——STAR，设计这些交互原型的原因。（第一章就是介绍鼠标，为什么要用鼠标？很大程度上就是为了精确度，单点控制，【而触摸屏的技术则叫做多点触摸】）</p>
<p>这里就可以发现触摸操作和鼠标操作的考虑模式就不同了，这个icon的交互行为实际上是对鼠标精确操作中的drag&#038;drop与我们日常操作行为进行了拼合，嫁接到了手指触摸这种模糊操作。这个地方如果进行简单的移植，而不重新思考和定义细节（从部件的感应域，到触发事件，到交互行为，到回馈都要重新定义，所以要做交互一定要学前端开发），就会出现这种过度设计。</p>
<p>（插播：我自己设计的过程中，基本不会用drag&#038;drop这种行为进行开关、选择性质的操作，这种行为我觉得是专门适用于定位和组织的，比如我以前介绍过的iamlin的这个实验性个站，我觉得它这个实验立意太浅了，开题的角度和应用都没有学弟的draware有深度，因为学弟在icon的操作上已经做到了语义同化。关于drag&#038;drop我在交互的两个方向中详细介绍过我的观点。）
<div class="comment-remix-meta"><a href="#" class="replyto" onclick="replyto('14','gundam215'); return false;">Reply</a> </div>
]]></content:encoded>
	</item>
	<item>
		<title>By: pluto</title>
		<link>http://www.shimuuu.com/blog/design-series-draware-concept-mobile-ui-design/comment-page-1#comment-13</link>
		<dc:creator>pluto</dc:creator>
		<pubDate>Fri, 07 Aug 2009 02:17:15 +0000</pubDate>
		<guid isPermaLink="false">http://iamfrompluto.cn/2009/08/06/%e8%ae%be%e8%ae%a1%e7%b3%bb%e5%88%97%ef%bc%9adraware%e6%98%af%e6%80%8e%e4%b9%88%e7%82%bc%e6%88%90%e7%9a%84%ef%bc%881%ef%bc%89/#comment-13</guid>
		<description>解释下：过度设计&lt;div class=&quot;comment-remix-meta&quot;&gt;&lt;a href=&quot;#&quot; class=&quot;replyto&quot; onclick=&quot;replyto(&#039;13&#039;,&#039;pluto&#039;); return false;&quot;&gt;Reply&lt;/a&gt; &lt;/div&gt;</description>
		<content:encoded><![CDATA[<p>解释下：过度设计
<div class="comment-remix-meta"><a href="#" class="replyto" onclick="replyto('13','pluto'); return false;">Reply</a> </div>
]]></content:encoded>
	</item>
	<item>
		<title>By: gundam215</title>
		<link>http://www.shimuuu.com/blog/design-series-draware-concept-mobile-ui-design/comment-page-1#comment-12</link>
		<dc:creator>gundam215</dc:creator>
		<pubDate>Fri, 07 Aug 2009 02:10:21 +0000</pubDate>
		<guid isPermaLink="false">http://iamfrompluto.cn/2009/08/06/%e8%ae%be%e8%ae%a1%e7%b3%bb%e5%88%97%ef%bc%9adraware%e6%98%af%e6%80%8e%e4%b9%88%e7%82%bc%e6%88%90%e7%9a%84%ef%bc%881%ef%bc%89/#comment-12</guid>
		<description>赞一下，不过icon交互那块我觉得过度设计了&lt;div class=&quot;comment-remix-meta&quot;&gt;&lt;a href=&quot;#&quot; class=&quot;replyto&quot; onclick=&quot;replyto(&#039;12&#039;,&#039;gundam215&#039;); return false;&quot;&gt;Reply&lt;/a&gt; &lt;/div&gt;</description>
		<content:encoded><![CDATA[<p>赞一下，不过icon交互那块我觉得过度设计了
<div class="comment-remix-meta"><a href="#" class="replyto" onclick="replyto('12','gundam215'); return false;">Reply</a> </div>
]]></content:encoded>
	</item>
</channel>
</rss>
