在Flat Design, Long Shadow之后,Low Poly算是最近平面设计中的一个新趋势。第一次接触Low Poly是在3dsMax里,当时为了模拟冰山的效果,通过增加点线面数,使多边形表面变得凹凸,Low Poly就是指用相对少的点线面来制作低精度模型。

贴一些别人的作品

制作Low Poly效果的思路很简单,以一张真实图片为底,按照轮廓,用三角形分割,越是颜色变化大的地方越细分,取每个区域内的某一颜色为整片区域染色。

这是一个用AI和PS纯手工制作Low Poly的教程

这是一个网页版Low Poly制作工具的github地址

于是,算是自黑吧。。用自己的照片做了个实验。。

高能预警。。。

总结了两点经验吧。。

  1. 照片的选取最好是侧脸,最好是脸部五官的轮廓、明暗都能看的很清楚的照片
  2. 外轮廓、颜色的交界处要增加锚点的数量,颜色变化相对平缓处可少添加一些锚点

就是这样的。。喵!

昨天刚吐槽TabBar,今天就要用到Axure制作一个TabBar了..

比较麻烦的是,为了实现高保真的交互视觉合一模型,我需要加入切好的图片。

【错误的尝试】

  1. 建立一个Master并取名为TabBar,这是为了在多界面间实现统一调用
  2. 拖入三个Image类的Widgets,分别Convert to Dynamic Panel,这是为了实现触发和未触发时的状态切换
  3. 每个Dynamic Panel设置两个State,分别拖入对应的Image
  4. 一切准备就绪,然后开始绑定事件,比如对Tab1,对它的OnClick交互绑定事件Set Tab1 to 1, Tab2 to 0, Tab3 to 0,Open View1 in Current Window,其余同理
  5. Preview的时候发现,当切换Page的时候,Master-Dynamic Panel的状态被重置了,并没有保持原来的状态

【官方教程】

查找解决方法的时候,看到了一篇实现Tab切换的官方教程,戳→Tab Control

它实现Tab Control的思路是用Rectangle作为Tab的背景,然后设置它的selected style,然后把它们合并成组,绑定OnClick事件为改变Selected属性

遗憾的是Rectangle暂时不支持以图片为背景的替换,戳→Fill a widget (rectangle, text box …) with a repeated background image

【解决方法一】

我想到的第一个解决方法是把三个View分成三个Page来做,每次在OnPageLoad的时候改变Dynamic Panel的State。这个方法确实可以实现一开始的目标。但是因为三个View被分成了三个Page来做,Page之间切换的时候不能实现交互动画,而且会出现明显的卡顿感。。在每个Page里都要重新绘制一次全局元素,非常麻烦和不优雅。

【解决方法二】

我想到的第二个解决方法是使用global variables,使用变量来记录目前Tab的状态,不管是把内容放在一起还是分成page,都比较容易,思路清晰

Axure做web还行,做客户端真是有些麻烦呢。。

先传个图,到时候做完了再把项目Po上来好了如果可以的话

突然冒出来的一点想法。Tab Bar确实比较适合那些功能多,重量平衡的App,但并不是所有的App都该有Tab Bar。尤其是像最近在做的这种导购类App,或者是新闻类App,都应该跳出原有的想法。
相反,最近我很喜欢那种悬浮式小图标。总是会贪心,想着把更多的空间转化为有用的价值嘛~

唉有空再写写长好了(´・Д・)」

——————————–

UPDATED 8.8

下定决心大做手术了!aitaobao Alpha不用TabBar了

终于明白为什么若汐要我不要那么着急做demo 实现动态效果了

之前她让窝画线框图,窝就在原来那个基础上稍微改了一下

她又叫窝画流程图,窝还是固定在原来那个版本的框架里

直到今天她叫窝写Story Board,窝才发现自己应该把所有的东西都重新考虑过!!

现在有种恍然大悟的感觉呢。。第一天来的时候,若汐要我去看那本《用户体验的要素》,之前看过几遍了,所以没太放在心上。而这个礼拜我的所有尝试都相当于是从五层结构的顶部走回底部,每走一次,就重构一次自己的想法。。虽然费了很大劲。。但至少明白了以后思考问题的时候一定要从底部开始,从最抽象的战略层开始,跳出原有的框架思维,逐步分析。

下周一就要做展示了。。看起来,周末是要回去做的节奏了。。

“没有灵魂,哪有筋骨,没有筋骨,哪有皮囊。”

大雾QAQ

准备 

01  注册成为apple developer

02  Quartz Composer

03  Origami

04 Avocado(可选)

参考

01 次时代交互原型神器Origami档案

02 Two Hours With Quartz Composer + Origami

03 UI Prototyping with Quartz Composer and Origami

04 Facebook小组 Origami Community

第一阶段 – 实现app启动界面和引导界面

第二阶段 – 实现Tab Bar

第三阶段 – 实现交互组件

第四阶段 – 实现二跳页

实现app启动界面

【目标】通过计时器,使启动界面的图停顿2秒之后实现渐隐效果

【用到的Patch】

  Timer

  1. 输入参数 Turn On – 决定Timer是否开始
  2. 输入参数 Duration – 决定Timer的时长
  3. 输出参数 Time – 显示逝去的时长
  4. 输出参数 Done – 初始值为True 到时间了之后值为False

  Transition

  1.  输入参数Progress – 过程比例
  2.  输入参数Start Value – 初始值
  3.  输入参数End Value – 终值
  4.  输出参数Value – 当前数值

暂时写到这里,待续