分类下相关文章
2019-08-25 · 阅读 2330 · 字数 114
关键词 时间限制 感官刺激 只让人来爽一回即可。 有感于三池崇史快速拍出的大烂片。 如果从这个角度看,版面设计是不是更应该突出爽。 如果电影是限定在90分钟,那么留给网站展现自我的时间上限应该是一分钟。 那么展示的方式就不能局限于传统的N栏结构了。 就是把一个网站当成一个电影来做。 图片效果 http://webdesignerwall.com/trends/47-amazing-css3-animation-demos quote 效果 http://jinkan.org ...
2019-02-19 · 阅读 6255 · 字数 108
蚂蚁金服的规范 https://ant.design/docs/spec/font-cn 在 Ant Design 的视觉体系中,我们建议的主要字体为 14,与之对应的行高为 22。其余的字阶的选择可根据具体情况进行自由的定义。建议在一个系统设计中(展示型页面除外),字阶的选择尽量控制在 3-5 种之间,保持克制的原则。 苹果 iOS 的规范 https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/typography/ 里面列出了常见的几种文本场景。 Google 的 material d ...
2019-02-12 · 阅读 11753 · 字数 109
生成过程非常简单,到网站 https://mybrandnewlogo.com 输入公司名称,输入 slogan,选一个喜欢的颜色。 Logo 就瞬间生成了,效果看上去确实不错。 ...
2018-12-18 · 阅读 5581
中午吃饭时,在微信读书上翻书时,读到了这么一段话: 产品的功能当然重要,但产品与用户之间的情感联系也不可忽视。就像希区柯克的两个剧本,“蓝色剧本”完全是功能性的,满足观众的理性的需求,“绿色剧本”则关注内容细节、情感主线等,关注观众的感受、情绪,满足观众的感性需求。好的产品,应该是在理性(功能上)和感性(情感需求)上同时抓住用户。 我觉得这个描述非常生动,产品应同时具备蓝色剧本跟绿色剧本。比我之前的产品认知:“有用,好用,有趣”,更触及产品的本质。 例如,好的导演作品,在叙事时候,总能恰到好处的融入主人公的生活细节,诸如,父亲与子女的关系等。 ...
2018-03-14 · 阅读 4725
原型图本质上是将想法具体化的一个过程. 心里障碍在哪里 担心设计的太丑,太粗糙 不尝试怎么知道;用工具做出来的不会差太多。 无从下手 just do it 方式1:把最核心的部分表现出来,其他部分一点点补上。 方式2:从用户注册、登录开始表现,太形式了,容易失去激情. 设计这两个字太虎人 这个名字不好 原型图本质上是将想法具体化的一个过程 这个过程也是不断验证自己想法、发现新需求的过程 工具选型 跨平台 -- 方便多人协作修改 小而轻 可持续维护 开源免费 目前来看只有 http://www.processon.com 满足这些要求。 ...
2017-06-14 · 阅读 4362
一定要用 bootstrap。节省大量时间。 nav 高度需要拉高,active 效果要明亮轻快些 body 下不要加统一的 wrapper, 因为有的是全屏的,有的是 1200px 固定宽度的 每个功能页面加点图片,会好看很多。例如,顶部图片 企业的重要信息最好显示在首页 着手编码之前,先在纸上将 HTML 结构构思好 轮播图能否配合 jumbotron 巨幕来展示 常用的基础功能 公司地址的地图展示 留言系统 ...
2019-01-18 · 阅读 7191
具体的动画效果可以通过 Animate.css 实现。 下拉到某处以触发 animate.css 效果,可以通过 waypoints 实现。 demo: var waypoint = new Waypoint({ element: document.getElementById('element-waypoint'), handler: function(direction) { this.element.className += " fadeInLeft"; }, offset: '75%' }); 注意,该 element 需要提前加上 cla ...
2017-05-01 · 阅读 13753
工具 查看邮件打开率,点击率,排版技巧等 怎样评价一封邮件的排版 内容优先 需要适配 PC,mobile,pad 的屏幕 手机、Web 端在邮件收件箱视图里能看到概要信息, 把重要数据显示在概要里,类似验证码短信会把验证码排前显示一样。 邮件排版相对 web 排版的特殊之处 只能使用 table 来排版 layout (tr>td 里再嵌套 table) css 推荐写成 inline 样式. head 里的 style 有可能被 email client 过滤掉。 宽度不要超过 600px,目前我使用的是 580px 图片域与邮件域最好相同 template 推荐使用 ...
2017-05-01 · 阅读 4299
将想法具化的一个过程。 为何要关注用户体验 一个产品成败的关键,在于用户如何评价: "这个产品能否给我带来价值?" "真的易用么?" "用起来愉悦么?" 这3个问题,会在潜意识里影响其是否成为你的忠实用户,而不是扫一眼就跑。 UX desgin 的目标就是,让用户对这三个问题都回答 “Yes”. UX 的第一原则 "一切皆是交流" “You cannot not communicate. Every behaviour is a kind of communication. Because behaviour ...
2022-03-31 · 阅读 8250
carousel 旋转木马 - 即网站轮播图 又名 slider(滑块),slideshow,gallery (美术馆、画廊) 现在几乎每个站都在使用轮播图/carousel,但是我自己做了几个站,并没有一个轮播图效果能让自己满意。 不满意的地方: 仅仅是好看的图片轮播而已,没有有效地传递信息 PC 端与手机端没有完美的自适应方案 如何充分利用轮播图传递有效信息? 第一个轮播图上的文字,必须能够简明概要的描述这个网页的主题。 例如,客户给了我们两句标语 工作理念:用手,用脑,用心,做最美的牙! 经营宗旨:品质惠苍生,诚信赢天下。 从概括主题的角度来看,第一句话适合作为第一个轮播图, ...
2017-01-07 · 阅读 6804
最近关注前端更多一些,发现目前主流的网站屏幕宽度有很大的变化。似乎变得越来越宽,比之前大气很多。 于是好奇地把经常上的几个网站的宽度查了一下 什么值得买 1200px 京东 1190px 淘宝 1190px 亚马逊 全屏自适应 qq.com 1000px 新浪 1000px facebook.com 1012px twitter.com 1190px 看来,使用 1190px 的更多一些 ...
2015-12-12 · 阅读 6051
昨天写一个 web 页的时候,突然感觉配色有点奇怪。 但是又不知道如何调整,我想这是每一个色弱党的痛点。 看了一圈颜色,发现只能认出蓝色、黄色、白色、黑色、部分红色。其他颜色一律不敏感。 是时候建立一套适合自己的配色方案了。 “对我来说,蓝色是最丰富的颜色。我能看到所有蓝色的东西。” - 扎克伯格(色盲,无法识辨红色和绿色) 整理了一下我喜欢的几个颜色 .color_block { width: 200px; height: 50px; } 蓝色 0000FF 0074D9 黄色 FFFF00 FFDC00 红色 FF0000 FF4136 白色 F0F ...
2015-12-12 · 阅读 6971
最让人苦恼的事情莫过于用户来了,啥也没点就离开了网站/应用。用户访问页数绝大多数为1。 页面反复改版,也没有效果。 几乎所有人都能看出问题出在哪里,“页面设计有问题!” 但是,如何解决呢?当前页面的设计好在哪里?问题又出在哪里? 怎样才算是一个令用户、令自己都满意的页面设计?如果一步步构建起来呢? 关键词 流程设计 你的目标 (objectives) 用户目标 转化漏斗 (Conversion Funnels) 流程设计必须回答的两个问题 你的目标是啥。即,你希望用户在你的应用上执行哪些操作。 用户的目标, 需求以及渴望是啥。如何满足用户。 网站的目标通常很容易细化: 注册账号 点击 ...
2016-05-23 · 阅读 6492
判断一个网站是否有价值的唯一标准 是否对自己有有用 网站模板 http://91mb.com.cn 工具 http://www.tubangzhu.com/ 投放广告的技巧 不要出现两个连续的广告 不同人群/不同类型网站的广告选型不同。例如,低端人群选择百度广告;高端人员投放 Google 广告。 Web UI 库 semantic-ui 设计上比 bootstrap 清晰许多 bootstrap pure.css 很多页面 demo, 例如图片站等 WeUI 微信官方的 UI 库,微信嵌入 web 页的首选 Bttn.css - Demo 按钮样式 管理后台模板 ...