5'->50h

~举例分析产品同技术的交流状态 (powered by rst2S5)

Authors:Zoom.Quiet
URL:http://zoomquiet.org/res/s5/120918-lb-5m-50h-story/

<免责/>

山寨的,非业界公认的,个人体验为基础! 是也乎;-)
参考所有同好行为总结而得
  • 一切资料来自网络互动挖掘
  • 一切想法来自日常学习工作
  • 一切体悟来自各种沟通交流
  • 一切知识来自社区分享印证
  • 一切经验来自个人失败体验

高橋流!

Takahashi-method 幻灯风格 源自 Ruby 创始人高橋征義(Masayoshi Takahashi)
高橋流

文字

Takahashi-method 幻灯风格 源自 Ruby 创始人高橋征義(Masayoshi Takahashi)

巨大

幻灯

Takahashi-method 幻灯风格 源自 Ruby 创始人高橋征義(Masayoshi Takahashi)

很多

播放

Takahashi-method 幻灯风格 源自 Ruby 创始人高橋征義(Masayoshi Takahashi)

快!

播放

Takahashi-method 幻灯风格 源自 Ruby 创始人高橋征義(Masayoshi Takahashi)

很快!

播放

Takahashi-method 幻灯风格 源自 Ruby 创始人高橋征義(Masayoshi Takahashi)

非常快!

所以:

Takahashi-method 幻灯风格 源自 Ruby 创始人高橋征義(Masayoshi Takahashi)

<brief/>

简单想,简单试,简单用... 是也乎;-)

Mouse Gesture

誰在用?! 是也乎;-)

手势

原先

静态图片呢 是也乎;-)
i/snap/lb_mg_orig.PNG

改进!

高级用户! 是也乎;-)

定制

产品

设计示意 是也乎;-)
i/snap/lb_mg_design.png

记住!

开始状态! 是也乎;-)

当前

JS代码

开始状态, 14行 是也乎;-)
cr.define('options', function() {
    const OptionsPage = options.OptionsPage;
    function MouseGestureOptions() {
        OptionsPage.call(this, 'mousegesture',
            '选项 - 鼠标手势','mousegesturePage');
    };
    MouseGestureOptions.prototype = {
         __proto__: options.OptionsPage.prototype,
        initializePage: function(){},
    };
    cr.addSingletonGetter(MouseGestureOptions);
    return {
        MouseGestureOptions: MouseGestureOptions
    };});

原始交互

纯静态 是也乎;-)
i/map/matter_sequence_Orig_wsd-omegapple.png

<brief/>

简单想,简单试,简单用... 是也乎;-)

尝试

<select/> 是也乎;-)

下拉

菜单

HTML

内置元素 是也乎;-)
<ul><!-- 所有可配置手势 -->
    <li>
        <span/> <!-- 当前手势 -->
        <select> <!-- 下拉手势选择 -->
            <option>
            <option>
            ...
        </select>
    </li>
    ...
</ul>

事务

同内核进行交互 是也乎;-)
i/map/matter_sequence_select_wsd-omegapple.png

原始交互

纯静态 是也乎;-)
i/map/matter_sequence_Orig_wsd-omegapple.png

还好

10小时 是也乎;-)

快速

完成

内核回调

内置元素 是也乎;-)
chrome.send('getCustomMouseGestureRules', []);
    <<< window.setCustomMouseGestureRules
        map:[ {"操作名":ID}
            ,"D":10002
            ,,,]
            无序...

唯一技巧

怎么记忆住? 是也乎;-)

上次

选项

标准属性

<ul lang="zh"... 是也乎;-)
i/snap/std_opt_lang.png

时间消耗:重构

集中力哪! 是也乎;-)

太丑!

产品吼 是也乎;-)

丑!

PS

永远伟大的... 是也乎;-)

5分钟

设计

用户喜欢美的 是也乎;-)
i/snap/lb_mg_design_ps.png

对比原先

静态图片呢 是也乎;-)
i/snap/lb_mg_orig.PNG

<brief/>

简单想,简单试,简单用... 是也乎;-)

寻找

美的下拉菜单! 是也乎;-)

寻找

Select to CSS

多种效果
U-Box TM2008 Mac
select2css_style1 select2css_style2 select2css_style3

DHTML

原理... 是也乎;-)
<div>
    <div/> <!-- 当前选项模擬 -->
    < ul> <!-- 选择器模擬 -->
        < li>
        ...
    < /ul>
</div>
<select> <!-- 原选择器 -->
    <option>
    ...
</select>

多层事务

同内核以及html进行交互 是也乎;-)
i/map/matter_sequence_css_wsd-omegapple.png

事务

同内核进行交互 是也乎;-)
i/map/matter_sequence_select_wsd-omegapple.png

原始交互

纯静态 是也乎;-)
i/map/matter_sequence_Orig_wsd-omegapple.png

多层事务

同内核以及html进行交互 是也乎;-)
i/map/matter_sequence_css_wsd-omegapple.png

程序行为

思维图谱 是也乎;-)
i/map/ms_gesture4css.png
  • leo_js_mg.png

文学化编程

Leo. 是也乎;-)
i/snap/leo_js_mg.png

时间消耗:重构

集中力哪! 是也乎;-)

<brief/>

简单想,简单试,简单用... 是也乎;-)

总之

期望记住的~单位时间能记住的只有7+-2 个 是也乎;-)

<discuss/>

是也乎;-)

Q&A

...

http://zoomquiet.org/res/s5/120918-lb-5m-50h-story/

最后的最后...

好书推荐... 是也乎;-)
讲演之禅

<版本/>

是也乎;-)
反馈:Zoom.Quiet@gmail.com
查阅:http://zoomquiet.org/res/s5/120918-lb-5m-50h-story/

S5

纯HTML 幻灯撰写框架!... lr_s5
  • 仅仅依靠 CSS+JS 的HTML格式幻灯演示框架
pix/2010-01-18-230729_605x421_leo.png

<Zoom.Quiet/>

本命+1,有娃没车,长年大妈 是也乎;-)
是也乎,是也乎