• 解读习近平八一讲话:铭记辉煌历史 推进强军事业 2019-09-15
  • 贯彻落实习近平生态文明思想 为建设美丽新疆作出人大贡献 2019-09-15
  • 广西河池消防支队召开新兵第二阶段集训工作部署会 2019-08-22
  • [网连中国]赛龙舟 包粽子 办诗会……全国各地品民俗迎端午 2019-08-22
  • 中国资本市场开放出大招 跨境证券投资更便利 2019-08-21
  • 新生入学网上怎么报名 合肥教育局解答常见问题 2019-08-21
  • 国务院允许符合条件外国自然人投资境内上市公司 2019-08-20
  • 端午节 收艾草(组图) 2019-08-20
  • 正式进入商用时代 刷脸支付,这一次中国又领先了 2019-08-13
  • 广东摧毁两“呼死你”团伙 恶意呼叫超过12亿次 2019-08-13
  • 人家80年前就造航母,我们现在才造航母,基础不一样。 2019-08-13
  • 上海交通大学校长林忠钦:自信从容办好中国大学 2019-08-08
  • 邢台:迎端午祥龙起舞祈吉祥 2019-08-08
  • 网约车司机因接客时间起纠纷 持棒球棍殴打乘客 2019-08-08
  • 回复@“老笑头”,你的这种逻辑是你当年生sj病住院时向你同室的“病友”学来的吧!哈哈哈哈! 2019-08-02
  • 网站设计必不可少的几款珍藏软件

    日期:2019-07-28 16:37:00 作者:柠檬味 出自:辽宁快乐12直选走势图

    辽宁快乐12直选走势图 www.rfqk.net 作为网站设计师,我们可以选择很多工具和软件,网站设计师不仅仅需要设计网站原型图,还需要设计网站效果图,网站动态图。所以就涉及到很多工具了,下面我们来说说一些非常好用,必备的软件。

    案绘制

    image.png

    Sketch

    在方案绘制这个环节,大家应该不陌生。首推的是Sketch,配合它使用的还有插件CraftManage,在绘制图片时使用它custom这个功能,可以随机更换填充图片,在做用户头像和APP里面的图片时特别方便。

    Photoshop

    Photoshop的功能在这里不再强调,在交互设计中,用来绘制方案没有sketch高效(原因我在之前的文章强调过多次)。但它强大的处理图片的功能,让人也忽视不了,经常能帮忙解决一些关于图片的裁切、格式调整、颜色等等的一系列问题。

    图片处理

    image.png

    这里的图片处理主要是指在导出供程序员使用的APP图片资源。为了降低图片所占内存大小,需要进行压缩,ImageOptim是个不错的选择,但它有时候压缩的大小并不是很大,因为是对图片基本是无损压缩。另外一个是在线工具TinyPNG,但对图片耗损比较大,适合图片透明区域比较多的情况。

    gif制作主要是将一些小视频(主要是APP的demo)其中的某一小段做成图片,方便和运营的童鞋们进行沟通,他们在发文时有时候需要用到。GIPHYCapture,操作简便,对录制的gif也可以进行编辑,使用非常方便。

    动效原型

    Flinto

    动效原型我试过很多种,最后剩下的是这三种,当然只供大家参考。Flinto是制作demo非常高效的工具,支持sketch导出。只要在sketch做好原型图然后通过插件就可以导入到Flinto。但Flinto的缺点在于,它缺少逻辑判断的功能。比如说点击一个区域可能有两张状况出现,此时Flinto并不能表现出这种逻辑关系,于是有了Origami作为补充。

    Origami

    image.png

    Origami是Facebook开发的一款动态工具,它的优点是能很细致地表达一款动效的状态出来,支持各种逻辑的跳转,并且可以调动手机摄像头,模拟拍照功能,可以调用JS代码。但它的缺点在于不能做太多的页面,二十个页面以上的效果就会卡,不支持sketch的导入,需要手动拷贝文件夹。对设计师来说,因为代码思维操作,学起来也稍微显得有点困难。

    Framer

    Framer比Origami更接近代码。兼容sketch和ps的文件导入,熟悉以后按照适合Framer的操作来组织sketch图层在导入Framer的话,非常便捷。有些重复的事情用结构控制使用代码更方便,可实现的效果跟Origami差不多。程序员学起来特别容易上手。这个我也才刚接触,很感兴趣,希望有一天也能成为大神。

    视频相关

    image.png

    1.视频制作

    动效demo有时候需要输出视频文件,想我做视频类的APP也经常接触到视频,所以这一块也有些鸡肋。视频制作软件功能最强大的就是AdobeAfterEffects,简称AE。学习成本不太高,跟其他视频制作软件的原理比较相似,就是在某个时间段内,将每个元素每个属性的变化进行拆分,一个个进行实现。

    FinalCut是Apple公司开发的视频软件,它更偏向于视频的拼接与合成,作为交互设计师,并不像动画师那样去制作,在视频这一块很多功能它就可以搞定。但FinalCut做出来的视频内存会非常大,一般5s左右1280x720px的视频可能就有200MB。

    (编辑:柠檬味)



    上一篇:更好的提升用户登录体验先解决标签和资源占用问题 下一篇:在画网站设计原型图之前需要注意的事情有哪几件
    18585853123
    在线留言
  • 解读习近平八一讲话:铭记辉煌历史 推进强军事业 2019-09-15
  • 贯彻落实习近平生态文明思想 为建设美丽新疆作出人大贡献 2019-09-15
  • 广西河池消防支队召开新兵第二阶段集训工作部署会 2019-08-22
  • [网连中国]赛龙舟 包粽子 办诗会……全国各地品民俗迎端午 2019-08-22
  • 中国资本市场开放出大招 跨境证券投资更便利 2019-08-21
  • 新生入学网上怎么报名 合肥教育局解答常见问题 2019-08-21
  • 国务院允许符合条件外国自然人投资境内上市公司 2019-08-20
  • 端午节 收艾草(组图) 2019-08-20
  • 正式进入商用时代 刷脸支付,这一次中国又领先了 2019-08-13
  • 广东摧毁两“呼死你”团伙 恶意呼叫超过12亿次 2019-08-13
  • 人家80年前就造航母,我们现在才造航母,基础不一样。 2019-08-13
  • 上海交通大学校长林忠钦:自信从容办好中国大学 2019-08-08
  • 邢台:迎端午祥龙起舞祈吉祥 2019-08-08
  • 网约车司机因接客时间起纠纷 持棒球棍殴打乘客 2019-08-08
  • 回复@“老笑头”,你的这种逻辑是你当年生sj病住院时向你同室的“病友”学来的吧!哈哈哈哈! 2019-08-02
  • 新时时彩一星开奖结果 大快乐时时彩 双色球的篮球投注技巧 30选5中了多少钱 体彩海南飞鱼6分钟开奖 360彩票军长推荐 复式三中二组数公式 广西体彩11选五开奖 黑龙江六加一开奖结果 北单开奖结果 三公扑克牌偷藏牌手法 爆大奖手机登录 57期天津快乐十分 808七星彩长条1448 手机投注新浪彩票