分享一个关于app icon设计的想法并求助相关知识。

2013-03-30 11:34:00 +08:00
 rayps
我是一名刚入行的UI设计师,
据我所知目前没有一种比较真切的方法预览我们自己所设计的 App icon,
光凭那张生硬的效果图并不能真正感受到icon的最终效果。
而且效果图也很难做到与最终效果一致。

昨天在一次讨论中突然想到一个idea
我们其实可以利用webapp的icon特性去测试我们所设计的icon,
并且能够真正去感受它,
我刚才已经凭着自己浅薄的前端知识加上网路搜寻勉强做出了一个测试demo
现在可以尝试拿出iPhone,
使用自带的浏览器safari 打开“icon.rayps.com”,然后添加到主屏幕即可。

我的想法主要是这样的,场景假设:
设计师想测试自己的图标时,只需要在电脑端的浏览器打开一个网页
我们现在假设是 www.icontest.com
呈现出来的是一个 “选择文件” 的按钮,要求是57/114等标准尺寸,当然也可以拖放文件
当上传完毕之后网页会提供一个独一无二/包含随机字符串的网址给设计师,
继续假设 例如 www.icontest.com/a1b2c3 又或者是?=a1b2c3 之类的
接下来设计师只需要在手机上做添加到主屏幕的操作即可。

我的疑惑是,请问要实现这个想法需要学习哪几个方面的知识?
有没有现成的第三方组件可以便于实现?
是不是需要有一个存放文件的服务器 / 有没有相关开放功能的网盘?
我大概需要怎么实现?
谢谢。
4777 次点击
所在节点    设计
28 条回复
astnd
2013-03-30 19:49:13 +08:00
@rayps 我理解你的意思 只是觉得输入网址也是一件非常麻烦的事情 或许可以开发一个简单的App 网页端上传图片 App直接推送网址 或者是手机上传图片 直接生成网址 这样的流程或许可以简化 用户也就不用手动输入 或者是用一些其他的工具来传网址了。
summic
2013-03-30 21:12:52 +08:00
可以这么做:
每次打开homescreen的web app,是会拉取最新的 apple-touch-icon 的
只要给个上传入口,加上身份识别,就可以了。

参考 Sun 这个webapp
plidezus
2013-03-30 21:19:28 +08:00
桌面截图一样,然后用psd抠好图标的外观。
使用psview,在ps中将新图标贴上去,在手机上立即看到效果。

没必要反复发明轮子,只是想看一眼效果而已……上传打开浏览器保存这个步骤好麻烦……
alexrezit
2013-03-30 21:21:14 +08:00
@rayps
给你发了一封邮件.
dingyi
2013-03-30 23:10:45 +08:00
Dzinlife
2013-03-30 23:55:02 +08:00
一个智能对象就解决的事情,楼主想太多
johnil
2013-03-31 00:21:49 +08:00
<link rel="apple-touch-icon-precomposed" href="http://(57px).png" />
<link rel="apple-touch-icon-precomposed" href="http://(72px).png" sizes="72x72" />
<link rel="apple-touch-icon-precomposed" href="http://(114px).png" sizes="114x114" />
估计楼主你需要的是它吧.

详细资料:
http://developer.apple.com/library/ios/#documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html
rayps
2013-03-31 05:17:07 +08:00
@johnil 嗯,正是因为知道有这个才想到的。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/64475

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX