Skip to Content
水墨
电子商务网站的用户体验设计
电商导航
淘宝名店
用户体验
数据分析
水墨之韵
关于水墨
优良品物
切图那点事儿
This entry is filed under 设计 and tagged 代码, 切图, 淘宝, 设计.
这篇文字是  做淘宝的也该懂点代码 的姐妹篇，切图的目的就是把设计图转化成网页代码，但是不用理解代码的含义也可以操作，所以独立一篇来讲。
早年间我学切图的时候，网上就没看到过什么教程的，只能靠自己摸索学习，挺简单的东西还是绕了点弯子。这次写出来应该会帮助其他人学会切图的。
先说下软件，我用的是PhotoShop CS5 这个版本，你要用其他版本也行，反正对切图这个功能影响不大。
做淘宝的也该学点代码
This entry is filed under 未分类 and tagged 代码, 淘宝.
原本想写个全面一点的设计教程的，虽然水平有限，但是作为自己曾经工作的一个总结也挺好的，现在看来恐怕是很难完成了。
既然如此，索性挑点内容来写好了。 先说说代码。早先我是做网页设计的，学了点前端代码，后来转做淘宝，虽然也用到代码，但两者不是一个层级的，淘宝这块用的都是最基础的东西。 虽说简单，但是内容还是有一些，学代码可以去http://www.w3school.com.cn，我文章里写的内容也会引用这个网站里的部分内容。如果我说的有遗漏或者不对的地方，你可以到这个网站自行学习，花不了多少时间的。
需要学习的部分包括两块，HTML和CSS。 首先你要明白的是浏览器依靠识别网页代码然后再把整个网页渲染出来的。如果把整个网页比作一个人，那HTML就是这个人的骨架，CSS就是这个人的皮肤。
譬如以下代码： <p>我是内容</p> 这就是最简单的HTML代码，<p> </p>分别表示这是一个段落的开始和结尾，段落内容是“我是内容”。 <p style=“color:#ff0000;”>我是内容</p> style=“color:#ff0000;” 这段代码是最简单的CSS代码，它的意思是文字颜色是红色。
显示效果如下：
淘宝店铺设计教程（水墨出品）
This entry is filed under 设计. | 2 Comments
第一篇：写在前面的话
写这篇教程的初衷一方面是分享（我已经半年多没写了），另一方面也是给自己的几个朋友看的，希望能帮助他们设计入门。
设计说容易也容易，说难也难，有些人天生美感好的，只要学会PHOTOSHOP就能自己做设计，有些人缺少天赋的，就需要教会设计的方法。设计并非纯粹的艺术，所以不需要天赋就能学会，要做一个合格的淘宝店铺设计师还是没什么问题的。
我做淘宝店铺设计的时间其实也不长，也就一年多而已。虽然我不是一个很出色的设计师，但是做设计的心得体会还是有一些的，我会把我会的东西按照步骤一步一步写出来，做成教程，由浅入深，我的希望是能让不会做设计的人在看完我的教程之后也能学会设计，那就很棒了。我会从基础的地方说起，会尽可能的说的全面，但是不会太脱离淘宝店铺设计的范围。
具体写哪些内容我还没有完全想好，边写边看吧，大致的框架如下：
1.PHOTOSHOP基础
2.淘宝店铺设计介绍
3.设计基础
4.淘宝店铺设计
5.网页代码
6.品牌设计
7.设计师的自我修养
8.运营相关
9.职业规划
内容很多，我也搞不清楚我需要花多少时间才可以完成，但是我觉得这是绝对值得我去做的一件事情。
估计写完这个，我又要停写很长时间了。写东西其实挺费精力的。
另外，我写的文章可能到后面会不断地补充修改，所以我的建议是尽量到我的博客（www.shui-mo.com）来看，这样能看到补充的内容。
这真的是一个很庞大的计划阿，双十二之后开写吧，希望能在年底写完。
有什么需要交流的可以在微博上找我，我的微博名字是 水墨_马冀
More..
淘宝店铺首页设计规划
This entry is filed under 信息架构, 用户体验, 设计 and tagged 淘宝, 设计, 首页.
电商卖家对淘宝店铺设计的要求正在越提越高，区别于京东和拍拍，淘宝店铺首页的设计至关重要，这里是最重要的门面。
淘宝集市店和商城店在首页装修上有一点小区别就是集市店页头那里有个独立的店铺logo展示区域，会对页头的设计产生一定影响。不过这篇文章并不探讨具体的设计，这里讨论的是整个设计规划和设计方法。
我把店铺首页分成4个需要设计的部分（除去这四块，其他根据产品类目的不同各有区分，这里不谈）。
1.页头导航
2.活动主题
3.主推产品
4.产品分类
由于是整个首页的设计，所以一开始就需要一个设计规划。
规划内容一个是店铺风格，一个是信息设计。
原先淘宝店铺的设计就是一个店铺的设计，现在的设计要求已经提升到了品牌化，品牌就应该有一个品牌的样子。店铺设计的重点就是产品陈列的一个设计，但是引入品牌的概念之后，就需要加入更多品牌的元素。
品牌设计里的VI基本要素系统主要包括：企业名称、企业标志、标准字、标准色、象征图案、宣传口语、市场行销报告书等。
其在店铺里的应用我们可以来分析下：
1.店铺的LOGO和名称肯定是有的，不需要我们重新设计。
2.标准字即便已经是名牌也未必有，我们在店铺设计里需要做的就是统一字体的应用，不能出现各种各样的字体，字体选择要少而精，这里包括里中文字体和英文字体。
3.标准色也是没有的，我们首先要参考logo的色彩，其次是区分竞争对手的颜色选择，还要参考行业和产品的色彩特征，综合之，一般情况下我们需要三个颜色，一个是基础色，一个是辅助色，还一个是突出色。实际运用中当然不可能只用三个颜色，这三个颜色是作为基准色存在的，不管店铺怎么改版，这三个颜色都还在，这样才能保证店铺设计的统一及连贯。具体到产品，例如女装女鞋，用的颜色很多很杂，但是在某些不容易改动的位置图片上我们使用的色彩必须是这几个基准色。
4.象征图案也可以说是辅助图形，怎样才能让消费者在见不到你店铺logo的情况下知道你是谁，消费者从搜索直接进入你的商品详情页她能知道你是谁么？象征图案的设计意义就在这里，它是和标准色组合使用的，一个店铺不能只靠logo来识别，其他还需要识别的地方就要靠标准色和象征图案来完成。
5.宣传口语往往就是一句话，它可以是品牌的一个定位，也可以是品牌的风格描述，也可以一句情感化的广告语。在理想情况下，店铺的设计应该围绕这句宣传口语来进行，这是很难的但也是最重要的，这里强调文案功底和设计功底，一般的店铺都没法做到这个层次。
店铺风格设定完成后我们开始进行信息设计。
信息设计指的是设计页面的哪一部分放什么产品什么文案什么内容。之所以把信息设计放到前面是因为这是核心，设计的本质是把信息视觉化，方便信息的传播，自然信息本身是至关重要的。
运营和美工间最应该协调的部分就是信息设计，导航里面要放什么内容，活动主题是什么要放什么文案文案的主次，主推产品有哪些，它们之间的推介顺序应该是什么样的，产品分类里面应该放多少个产品是否需要主次顺序等等，只有这些都商量好了，后面的设计才能更顺利地进行，否则后面对设计稿的改动