Skip to main content

Home/ 互联网之'我的阅读'/ Group items tagged ui设计

Rss Feed Group items tagged

ocean wu

科学与艺术兼顾的有效网页视觉设计 - 以用户为中心的设计 - 0 views

  • 理性 基于科学考虑的功能性图形设计也就是我们经常讨论的GUI,它主要服务于系统化平台的交互系统,协助、指导用户顺利完成期望的任务流程,一般我们接触到的视觉设计元素包括: 图片按钮; 导航设计; Banner动画或静态设计; 表单样式设计; 表格、数据、文字表现设计; logo设计 以及图形化不强的页面文字排版、空白布局设计
  • 为什么现在有很多GUI都想转行做UI或ID(interaction design),而忽视视觉设计的价值?我觉得这里面有下面几个原因: 市场恶性竞争,促使视觉审美下降,从而导致创意制作的贬值。所以,除去个别优秀的视觉设计师,处于中间或下层的设计师很容易失去自我价值的鼓舞而放弃自己的初衷,希望能够寻觅一个新的行业方向。而根据现在的市场需求,UI、ID应该是一个比如容易切入的方向,毕竟通过理论的补充,可以在很短时间内有效的提高设计师自身的设计理念而适应新的行业需求。 还有一个原因也是上面提到的市场需求决定了设计师对可用性和用户体验的关注,目前大多数设计师都服务于综合性媒体的网络公司,这样也就局限了他们创意设计的需求,取而代之的更多是对实用性,高效性的页面设计要求,所以学习相关的理论知识以适应公司发展需求是非常容易理解的, 最后就是设计师本身的自我定位,据我所知,国内目前并没有一个很好的针对网页视觉设计或用户中心设计的专业培训,所以,入行的设计师未必都有很好教育背景,大多都是因为兴趣爱好或市场需求而不断调整自己在整个行业中的角色,就业的需求,再加上诸如UCDCHINA理论资源的不断涌入,让很多本就不成熟或说对自己职业方向不明确的设计师,看到新的适合空间,所以这样的转行也是完全可以理解的。
  • 感性、个性 再说说基于视觉艺术考虑的视觉冲击设计,这类型的设计自由空间大,没有太多理论约束,更多体现出个性元素的概念,其多运用于概念产品、时尚产品、游戏娱乐等独立站点或个人Portfolio Gallery站点里。 上图是来自http://www.rhythmoflines.co.uk/   尽管我们不断推崇务实的简约设计概念,但是另类的创新艺术表现还是不时的冲击着我们不断变化的行业趋势。这类设计的好处在于: 容易创新出新型的交互设计模式; 增加产品自身的品牌价值,也就是我们所说的“化腐朽为神奇” 深刻的视觉冲击,有利于品牌形象的传播; 具有艺术收藏性,树立流派典范; 激励不同类型的设计尝试; 不过如果从实用性来考虑,它可能也会存在下面的不利之处: 生存周期相对较短,也就是高投入未必能带来长期利用率; 浏览文件大,需要更多下载时间,如果平衡的不好,很容易起到负面效果; 兼容性考虑不够,比如插件要求,分辨率要求等; 目标群体的局限性; 总的来说,根据具体运用和项目的商业策略的不同,我们在设计管理上也应该做相应的平衡,是提高有效的视觉传达?还是个性品牌的冲击? 这就如同我们在科学与艺术直接需要平衡点一样。
ocean wu

2009年海外Web设计风潮(上)_斐派精准 - 互动体验,精准营销 - 效果为先,见效付款,承诺效果 - 0 views

  • ...73 more annotations...
  • 2. 富UI 现代 Web 中的 UI 变得越来越漂亮,越来越好用。过去的一年,Web 中的 UI 有了显著提高,有了一种接近桌面的感觉。Ajax 和 Flash 被广泛使用。 特别是我们比去年看到了更多留白区域,还看到很多现代的 UI 技术会显示用户同系统之间交流的视觉状态,比如,按钮在正常和被按下时显示不同的样子,用户同系统交互时能及时得到反馈,另外,越来越多的服务可以被用户定制。
  • 1. 凸版印刷风格 这种风格有些出人意料,可能因为之前很少有人使用。该风格在在各种主题的网站中都有,但主要用于产品设计或在线服务类网站。
  • 3. 透明 PNG 使用 PNG 实现透明虽然不被 IE6 支持,却在过去的一年大行其道。设计师们似乎正在尝试将背景图片和内容融合并实现一些印刷媒体的风格。比如,将 PNG 半透明图片放到整体背景的某个区域上,用来加亮显示这个区域,如标题或声明。一些 PNG 同名技术还用来实现灯箱框效果。 Smashing Magazine 去年曾有篇使用透明效果实现创意设计的文章,很多设计师在他们的作品中开始尝试这些技巧。有趣的是,透明效果常被用于页首和页尾部分,不过也有些例外。
  • 4. 巨大字体 以前的文章中我们曾介绍过巨型字体设计,2009年,巨型字体设计还会风行,尤其是那些设计社,以及展示型,产品介绍型,或在线服务型网站,他们会使用巨型字体显示重要信息。 巨型字体设计中使用的字号往往超过36px,设计师们对字体编排注入了更多关注,以实现更漂亮,更连贯,更值得信赖的站点。
  • 6. 灯箱效果 灯箱框是第二代弹窗,它们比第一代基于 JavaScript 的弹窗更友好,可以让用户将注意力集中到最重要的部分。这些窗口一般由用户的某个行为激发,并显示在其它内容的上层,他们有时候是半透明的,并包含一个关闭按钮。
  • 5. 代用字体 设计师们还把更多注意力放到字体上,虽然经典的 Web 字体,Helvetica, Arial, Georgia 以及 Verdana 等仍占主流,一些代用字体正浮出水面(如 sIFR)。 有趣的是,这些字体会和设计无缝地衔接,设计师们似乎并非为字体而字体,而是要将字体同他们的设计结合在一起实现更漂亮的效果。
  • 7. 媒体块 随着宽带接入的普及,用户现在可以承担更丰富的内容,设计师们也借机提出更有吸引力的内容。越来越多产品网站使用媒体块显示视频,让用户更容易理解这些内容。用户只需靠在椅子上看视频,不需要一步一步往下点,这些食品通常比较短,直奔主题,虽然很正规,但也包含一些娱乐性。 不过请注意,视频应当是你内容展示方式的次要选项,并不是所有人都有宽带接入,也不是所有人都喜欢有视频播放(他们可能正在后台听网络收音机或播放音乐),另外,也不是所有人都启用了 Flash 和 Javascript。
  • 8. 杂志外观 传统印刷媒体设计中使用的编排技术也出现在 Blog 设计中,文章的编排,文字排版,图片甚至对其方式。基于网格的设计也很流行,但主要用于展示与产品页以及大型博客,极少用于公司网站或网店。
  • 9. 滚动幻灯导航 幻灯片水平和垂直滚动,可以向不同方向滚动,当前项加大加亮。这种导航技术可以让用户快速直观地浏览站点中的内容。一般常用语娱乐性网站,另外,设计者还可以使用该技术展示他们的作品。
  • 10. 在重点位置做形象展示 网站的左上方一般是一个站点最重要的区域,因为那是用户注意力最集中的地方。因此,在那个部位放上网站中最重要的信息是明智之举。 事实上很多设计师正是这样做的,不管是 Web 程序,公司网站,在线服务还是作品展示,设计师们将口号或简介性内容放在那里,并使用醒目的排版给用户以良好的第一印象。这些内容长短不一,不管哪种方式,但它们都占据可观的空间,一般横跨整个幅面,高度在250到400之间。不过这些形象展示性区域一般并不用于博客或在线商店。
  •  
    2009 Web 设计风潮 1. 凸版印刷风格 2. 富UI 3. 透明 PNG 4. 大字体 5. 代用字体 6. 灯箱框 7. 媒体块 8. 杂志式样 9. 幻灯滚动 10. 重点展示区域
ocean wu

2009年海外Web设计风潮(下)_斐派精准 - 互动体验,精准营销 - 效果为先,见效付款,承诺效果 - 0 views

  • 反 Box 式布局 单页布局 多栏布局  巨型插图与多变背景 更多留白 社会网络元素 讲解式导航菜单 Status elements (Flickr, Twitter et al) 动态 Tab  超大搜索框 Category visuals 作者头像图标 (这也算?-译者) 图标和视觉引导 Tag 索引 (取代 Tag 云) 插图风格 水彩风格 手写风格 怀旧风格 有机纹理或照片背景 证章风格 价格标签风格  条带风格
  • ...51 more annotations...
  • 2. 单页布局 单页布局是使用一个单一的页面展示站点的全部内容,这并不意味着站点内容少,这个页可能很复杂,包含了大量图形和动画效果,加载的时间也会有些长。比如,用户点击导航菜单后,该栏目下的新内容会在旧内容处通过渐入渐出,滑入滑出等动画效果显示出来,而页面其它部分始终保持不变。(白宫的最新网站的首页就有这个意思 - 译者)
  • 3. 多栏布局 多栏布局(大于3栏)通常比较复杂,但通过适当设计,会对访问者带来更好的访问体验。最近几年,Web 内容爆炸,用户停留在一个网站的时间越来越少,就要求  Web 设计者尽可能有效地展示数据,既要让访问者多停留,又要让他们更容易发现他们希望看到的内容。
  • 多栏设计一般用于杂志布局或展示型布局站点,一般使用网格布局技术实现。多栏布局一般使用概述/细节式结构,首先用多栏展示概述式内容,然后进入详细内容的展示。Mozilla Labs 就是一个很好的例子。
  • 4. 巨型插图式与多变背景设计 象巨型字体主导当前 Web 设计一样,巨型插图风格设计似乎也正流行起来,巨型插图可以和巨型字体的结合使用,带来更吸引人,更生动的效果。 另外,设计师们越来越喜欢使用那些色彩鲜艳的图形提供背景,包含各种风格,抽象画,剪贴画,剪贴簿,装饰画,怀旧,水彩,有机纹理以及照片背景等。
  • 5. 更多留白 这是近年来最值得期待,也是最有意义的 Web 设计风潮,设计师们在页面留白方面越来越慷慨。(这也是我非常欣赏的一种风格,只可惜在我们国内,仍有大量的客户认为满当当的页面说明你的公司实力雄厚 - 译者。)
  • 6. "社会"网络元素 任何人都喜欢流量与认可,在 Web 设计中加入社会网络元素,可以鼓励你的访问者参与进来。(不过在 Web 2.0 日渐式微的今天,也许满页花里胡哨的社会网络元素正逐渐变得让人厌烦 - 译者)
  • 7. 解释风格的导航 传统的水平导航条,一般是一些标题连接或图标链接,用户很难从这些短短的信息中真正知道这些导航所代表的内容,解释性导航会在栏目导航菜单上提供进一步解释内容,让用户更好地理解这些栏目代表的内容。
  • 这类导航一般使用更容易表达内容的大图标,加解释性文字,鼠标 Hover 效果也必不可少。
  • 8. 动态 Tabs 这类设计一般在页面加载时,将多个 Tab 中的内容一次性加载,通过 Javascript 或 CSS 效果,实现鼠标指向某个 Tab 时,该 Tab 中的内容立即显现。(微软官方站近一年来一直是这个设计风格的代表。- 译者)
  •  
    1. 反 Box 式布局 2. 单页布局 3. 多栏布局 4. 巨型插图与多变背景 5. 更多留白 6. 社会网络元素 7. 讲解式导航菜单 8. Status elements (Flickr, Twitter et al) 9. 动态 Tab 10. 超大搜索框 11. Category visuals 12. 作者头像图标 (这也算?-译者) 13. 图标和视觉引导 14. Tag 索引 (取代 Tag 云) 15. 插图风格 16. 水彩风格 17. 手写风格 18. 怀旧风格 19. 有机纹理或照片背景 20. 证章风格 21. 价格标签风格 22. 条带风格
ocean wu

Principles Of Effective Search In E-Commerce Design - Smashing Magazine - 0 views

  • 良好的设计高级搜索有几个好处,可不仅仅是一个笨拙的,复杂的工具。首先,有效的搜索可以加速销售过程。销售可以更快 增加转换,因为你不会失去客户谁放弃试图寻找的产品。此外,快速,准确,成功的搜索增加您的客户的信任。在本文中,我们会检讨如何建立一个接口,为用户提供 权力的高级搜索 同时保持 清晰的简单的搜索.还要考虑我们以前的文章:设计搜索结果:最佳实践和设计模式设计神圣搜索框:实例和最佳做法15个常见错误的电子商务设计
  • 1。拆除壁垒虽然几乎每一个电子商务网站拥有先进的搜索,旅客不使用它。首先,人们只使用的工具,他们看到的。高级搜索通常是很难被检测到。这个链接通常是太小和丑陋,所以华而不实简单的搜索按钮附近制伏它。因此,即使用户倾向于执行高级搜索,他们没有这样做的动机。这个词本身是可怕的:“先进的。”这意味着我们将要遇到的事情复杂化。很多时候,我们做的。但即使我们看到先进的搜索链接,并没有因为它吓倒,我们不使用它,因为我们 看不到好处。谁做的少数使用它看到,一旦他们执行搜索,所有的“先进性”都将丢失。因此,要帮助我们的用户利用先进的搜索能力,我们必须解决的可用性问题,实施新办法,改进我们的搜索术语。2。方法有几种方法,提高检索。对先进典型的做法是搜索 参数搜索。用户设置参数的使用文本框,经营者和下拉菜单。何时 可用性大师告诉你不使用高级搜索,它们通常指的是这种类型。它通常有一个复杂的接口,但可以是非常简单而有效的,只要最重要的字段显示,你坚持形式设计的基本准则。Momondo 优雅,有效地坚持最重要的投入领域,使参数搜索用户友好。Trulia的's参数搜索是较为复杂,但通过输入提示周到的支持和提示。选项更是隐藏在“更多搜索选项”高级用户的联系。一个好办法,避免畏惧的人,是变相的参数搜索的复杂性。只显示片段接口的使用 响应披露/使反应模式。当用户设置一个参数,他们沿着,然后下一个过滤器显示。该解决方案可以用来指导新用户,但它可以刺激孔和高级用户。论 MyBankTracker,用户必须选择“是”的“比较的”什么是您目前的APY?“的问题,显示您的银行APY”选项。分层搜索 电子商务正在成为事实上的标准电子商务网站。用户执行一个简单的搜索第一,但在结果页上,然后,他们可以通过缩小钻链接(单一选择)或1(对于多个不重叠的选择)复选框选择搜索。这可以高于进步披露/有利的模式,易于使用普通高级搜索。 亚马逊 采取了类似但略有修改的方法:当用户开始搜索时,他们可以像一些缩小设置过滤器“,只有书”在一开始。过滤 亚马逊.过滤的搜索 加+ 是一个比较复杂,但仍然容易使用。又是支持输入提示和提示。
  • ...3 more annotations...
  • 结论相反,人们普遍认为,高级搜索是不是老伐木过去的怪物。如果考虑到实用性和关键结构和概念所作出的修改,它可以是一个有效的工具 增加转换 并帮助用户访问更多的产品。当然,不是每一个电子商务网站需要先进的搜索。您可能太少产品或你的产品可能是独特的,难以区分。高级或分层搜索,较有利于当你有各种各样的产品。
  • 更多资源有益的,好的搜索界面的例子推进高级搜索彼得莫维尔搜索模式3快速设计模式的更好的分层搜索10规则的分层搜索的旅游网站最佳实践设计分层搜索过滤器过滤排序:提高产品findability电子商务面导航搜索和高级搜索用户体验需求高级搜索:是的名称问题?
ocean wu

把用户当傻瓜,就能做好设计吗? - 0 views

  • 为用户提供好的用户体验,是产品设计(不仅仅是网站设计)的目标与方向。
  • 用户体验不等于以用户为中心的设计,UCD是改善产品用户体验的一种思想。而且,以用户为中心的设计,也是存在争议的,到底以用户的什么为中心进行设计?动机、需求,还是期望?是任务驱动?还是目标导向?
  • 通过采用一系列科学、严谨的设计流程与方法,可以避免以往产品中出现的、影响用户体验的问题,再次出现在新产品中。
  • ...1 more annotation...
  • 与产品定位有关,没有任何一款产品适合所有用户,不同的人群,有不同的需求,甚至可能不需要这种产品。
  •  
    让新手用户以最短的时间了解产品的操作方式,建立起对产品的正确心智模型。同时,对于新手与中间用户采用不同的流程,让中间用户有更方便的途径完成操作,这是一个更为合理的设计方向。
ocean wu

ui花园 - 编织可用性与文化: 创新的用户界面 - 0 views

  • 几种有趣的用户界面设计,它们是: • 滑块筛选 (Slider-based Filtering) • 鱼眼菜单 (Fisheye Menus) • 树图 (Treemaps) • 拖放(Drag-and-drop)
  • 滑块筛选 Amazon’s Diamond Search (亚马逊的钻石搜索)的用户界面采用了点击-拖拽的滑块,这样用户可以扩大和缩小搜索的筛选标准。用户通过滑动来变更用户选择的标准时,该页面可以自动的更新搜索结果。 这个界面具有直观和信息丰富的特点,用户可以很容易的在大量信息中搜索所需要的结果:
  • 鱼眼菜单 鱼眼菜单(Fisheye menus )对于帮助用户浏览很长、但有序的列表很有用处。该菜单可以动态的变换菜单条目的尺寸,将鼠标所在区域放大。这样便可以在一个屏幕上显示并操作整个菜单了,而无需传统的按钮、滚动条、或分级浏览结构。
  • ...2 more annotations...
  • 树图 树图(Treemaps)可以将多列数据以方块组的形式展现出来,这些方块还可以加以不同颜色、以不同大小组织起来,从而以图形的方式来揭示数据内在的模式。这种用户界面可以用来表现复杂的数据关系(比如层次关系等)。 在网站Smartmoney website上,便有一个这样的例子。通过这种用户界面,浏览者可以一目了然的看到数百种库存的信息。下面的图例中,库存货物信息根据不同行业被分组,进而按照其市场资本的大小以不同大小的矩形 表示出来。而颜色则用来表示价格的升(绿色)降(红色)。 要了解一个公司的详细情况,则可将鼠标移至该公司所在矩形的上面(下图展现的是通用电气公司的情况)。
  • 拖放 拖放(Drag-and-drop)这种用户界面设计采用了使用者所熟知的移动元素的操控方法(使用者可能有过使用微软视窗应用的经验)。在恐怖小屋的在线商店(Panic Room’s online store)的网页上,要将物品放入购物车中,浏览者可以点击带有加号图标按钮,亦可通过拖放动作来完成。 拖放动作比较简单,先点击你要加入购物车的物品:
ocean wu

完整的CSS工具列表_Yum.cn Design Studio - 0 views

  • 用户界面 I Like Your Color 输入URL然后它会抓出其中的颜色并用16进制表示。 CSS Multi-element Rollover Generator 使用CSS和一个图片创建出一个翻转按钮的样式。 CSS Rounded Box Generator Ruthsarian Layouts 6个CSS页面布局模板,包括颜色、标题等。 Bluerobot Layout Reservoir 2栏和3栏的CSS布局框架 Glish CSS Layout techniques 2、3、 4栏的CSS布局框架 The Layout-o-matic 输入页宽、栏数和padding,它会自动生成CSS和HTML的布局框架。 Little Boxes w3cn.org上提供的那些布局模板 Open Source Web Design 各种免费的完整页面模板 Web Builders’ Toolkit 更多的模版资源 Iconico Online CSS Scrollbar Color Changer List-u-Like 一个CSS菜单生成器:轻松创建采用li并兼容各种浏览器的导航菜单。 Nifty Corners: 无需图片的圆角矩形 Round Corner Stone/Icon (rcsi) V1.0 增强的圆角矩形 Xylescope 无需下载其他站点就能轻松分析其CSS代码。 W3C Core Styles Checkliste zur Webseitengestaltung Testseite zur Zeilenbreite
  • 易用性检查 Accessibility Valet Demonstrator Bobby Online Service Cynthia Says OCAWA Web Accessibility Expert Torquemada 使用工具对页面进行一个完整的易用性分析方法测试,以快速辨别页面中哪些部分存在错误。 UI Site check 一个站点检查工具,只需要输入你的网址,便可以列出几十个验证器和易用性工具。 WAVE 3.5 Accessibility Tool 可以提供你页面上的易用性细节和错误方面的有用信息。他会用红黄绿蓝等几种图标来表示需要改进的页面部分。这些图标代表了你页面上有关结构、内容、可用性和易用性方面的问题细节。你可以清楚地看到当前页面上哪些位置存在问题。 Web-based Site Usability Checker WebXACT Quality & Accessibility Check 一个免费的在线服务,让你对单个页面进行质量、易用性和保密性问题的测试。 Will the browser apply the rule(s)? TAW - Test accessibilidad web
  • 整理和优化 CSS Formatter and Optimiser 能让你选择你的CSS更易读还是更小。 CSS Compressor 使用这个工具可以压缩你的CSS使之提高载入速度和节约带宽。 Online CSS Compressor 多种途径来清理并压缩你的CSS,牺牲了可读性来获得相当程度的优化和尺寸的减少。 CSS Compressor CSS Syntax Checker for BBEdit and TextWrangler CSSTidy CSSTidy 是一个开源的CSS解释器和优化工具 CSS Tweak ~ Web Based CSS Tweaker! CSS Tweak 会优化你的CSS以减少文件大小和下载时间。 Clean CSS - Optmize and Format your CSS Format CSS Online 自动格式化你的CSS使之便于阅读和编辑 Online CSS Optimizer CSS Optimizer 优化并减少CSS的文件尺寸 Online CSS Optimiser/Optimizer 这个工具用于优化CSS代码。 Tabifier 使HTML和CSS代码变漂亮。 Webucator 有一个CSS参考手册,你还可以在上面测试你的CSS代码 CSS Centricle CSS hack浏览器兼容一览表 (就是w3cn.org 上的那个)
  • ...5 more annotations...
  • 字体 CSS Font and Text Style Wizard 你可以在这里测试用不同的字体和样式来生成CSS源代码。 Em Calculator 转换字体大小到em的工具 text sizing - up the garden path 不同浏览器下字体表现的研究,共有264个截图。
  • 表单 Accessible Form Builder 轻轻松松生成符合XHTML标准的表单。 CSS Form Code Maker 表单生成器 JotForm 所见即所得的表单生成器 korhoen typeviewer 帮你查看CSS的排版效果,帮你调整使之易读。
  • 布局 CssCreator -> Page Layout: this generator will create a CSS layout that has fixed width left and/or right columns with a dynamic width center column, all the same height with header and footer. CSS HTML PHP Website Template Maker 一个PHP - HTML - CSS模板生成器,可以生成包括页头和页尾的两栏布局的模板。 Firdamatic Firdamatic? 是一个无表格的布局生成器。 Free CSS Template Code Generator 生成三栏的布局 Layout-o-Matic 也是一个无表格的布局生成器。 QrONE CSS Designer 在线CSS生成器 Scriptomizers 一个CSS样式生成器 The Generator Form v2.90 1-3栏可定制的CSS页面生成器。
  • 酷站 CSSElite openwebdesign.org 设计师和站长在这里分享网页设计模板和资讯。 CSS thesis Wow-Factor Web Standards Awards W3 Compliant Sites Unmatched Style The Weekly Standards CSS-Mania CSS Drive CSS Import CSS Zen Garden CSS Vault CSS Beauty Stylegala
  • 小贴士 CSS-Based Forms: Modern Solutions样式表定义的各种漂亮注册与登录表单的收集。 Hot Dates with CSS 教你怎样使blog的日期看起来像日历页。
ocean wu

60个文雅悦目的网站设计 at 漫游世界三万日 - 0 views

  •  
    Tomá? Ledba _ graficky design _ web design _ corporate identity
    2. Intype3. BigFilebox
    4. FreelanceSwitch5. FluidBook6. Panic - Coda - One-Window Web Development for Mac OS X7. boo-box, as simple as that… 8. Future of Web Apps9. Freshview - Refreshingly Simple Software10. Welcome to Revyver11. allpaymedia.com | Welcome
  •  
    Tomá? Ledba _ graficky design _ web design _ corporate identity2. Intype3. BigFilebox
    4. FreelanceSwitch5. FluidBook6. Panic - Coda - One-Window Web Development for Mac OS X7. boo-box, as simple as that…8. Future of Web Apps9. Freshview - Refreshingly Simple Software10. Welcome to Revyver11. allpaymedia.com | Welcome12. Stuff and Nonsense13. StyleSpion14. Online Portfolio of Vijay S Nair15. Svenigson? - Yes, a
ocean wu

【8090在职场】技术型营销人必知的8个领域!你的知识足够吗? | SocialBeta(解读社会化商业的价值) - 0 views

  • “技术型营销人”有时会被泛泛地解释为“在营销领域使用各种科技的人”。然而,在这个时代,所有营销人员都要或多或少的在营销活动中使用现代科技(尤其是信息技术),如何区分技术型营销人就变得很重要了——他们在技术领域到底走得比普通的营销人远多少呢?
  • 据此,我们可以清楚地分辨普通的营销人和技术型营销人:
  • 他们应当了解这八个领域中的专业化知识,并且精通其中至少两或三个领域。 数据收集与分析——数字化营销驱动力的管理、测量和处理 营销应用——营销软件的配置、操作和整合 广告网络——整个数字化广告系统的管理和优化 社交&移动平台——Facebook, Twitter, LinkedIn等等,以及这些网站使用的工具和应用程序界面 内容营销——管理内容营销过程的整个生命周期,尤其是搜索引擎优化方面。 网络机制——对于网络和浏览器平台的完整详尽而又清晰的理解 软件设计——如何陈述、阅读、编写技术领域的通用语言 IT运营——利用云计算和IT强大的联络关系网
  • ...6 more annotations...
  • 数据挖掘与解析——数据专家是那些“能够捕获、过滤、探索数据并进行建模、总结说明等工作的人,他们是骇客,统计学家和机器学习专家的融合体”,详见“数据科学韦恩图”  网络&社会化媒体解析——对于工具——从Google Analytics(网站)到Radian6(社交媒体)——技术性和解释性的理解、掌握,详见Avinash Kaushik和Web Analytics Association A/B测试&多元化测试——数据分析和内容营销(最重要的是包含测试导向型营销)的混合体,详见Conversion Science,Which Test Won?以及ion’s post-click marketing blog
  • 邮件自动化&营销自动化——半自动化的“客户培养基”平台的配置及操控,请见Email Insider,MarketingAutomationSoftware.com,Propelling Brands以及Eloqua 客户关系管理——客户关系管理系统,如Salesforce,以及现代化营销的中流砥柱——全新的社会化客户关系管理方法,详见CustomerThink以及Destination CRM 内容管理系统&数字资产管理——(网络)内容管理系统和数字资产管理,组织元数据,请看CMS Wire, Digital Asset Management, Drupal以及Nimble report 付费点击广告管理&竞价管理——针对谷歌,必应和Facebook的点击付费广告管理策略及工具,请看PPC Hero,Clix Marketing,WordStream, Click Equations 以及 this post 行为定向——受众定位/市场细分以及广告网络内部的数据交换,再营销或者兴趣导向广告,请看Behavioral Insider,BlueKai及Quantcast
  • 移动&社交应用程序界面——超越那些长得几乎一模一样、使用同一UI的山寨应用,直接开发平台提要,实现功能和设计上的融合,请看Facebook APIs,Twitter APIs,Google APIs,Mashery还有Programmable Web 社会化媒体优化——社会化媒体优化是为了最大化内容分享数和影响力,加强分享键、徽章标志和工具条的作用,详见Open Graph protocol,OAuth,Rohit’s 16 SMO rules以及5 new rules 视频网络&传输网络——视频制作、格式转换、编码和传播的过程,内容传播网络的技术性和经济性,详见Akamai,CloudFront,Ooyala和Brightcove
  • 搜索引擎优化——搜索引擎优化的目的是使公司在谷歌/必应上的排名不断上升并尽可能排到高位,请看SEOmoz,100% Organic,Google Rich Snippets,GinzaMetrics还有Conductor HTML, XML & CSS——提高对于网络标记,浏览器功能和全新的HTML5的功能的熟悉程度,请看QuirksMode,CSS Zen Garden,XML.com和Visibone’s HTML cheatsheet HTTP, REST & Cookies——网络协议,IP和DNS,URLs和可以使用表属性状态转移(REST)的接口,SSL是如何发挥作用的,高速缓存,cookies以及第三方cookie约束,请看Fielding/Taylor paper Javascript——网络应用程序的客户端语言,Web 2.0时代的行为,Ajax,参见jQuery,Mozilla Developer Network,Visibone’s Javascript card以及regular expression cheatsheet 应用程序框架——服务器端网络软件的开发,iPhone和Android的APP,你自己的实用程序和自定义设置,参见PHP,Rails,Django,Stripes和ASP.NET MVC 敏捷开发过程——对于进行软件的敏捷开发的经验(比如Scrum的开发经验),改编后应用至敏捷营销之中。详情参见Agile Manifesto和Agile Marketing blog “云”计算——评估,安装,操纵和监控基于“云”技术的设施、平台和应用,松散耦合结构的集成,参见Amazon Web Services,Heroku和Azure
  • 隐私与安全——如何强化隐私策略,网络与云端的安全问题,请看Google Privacy Principles,Network Security Blog以及CERT 数据库与大数据——相关数据库以及SQL,NoSQL数据存储站点,第三方数据设置,大规模数据处理Factual,InfoChimps,Hadoop以及Google’s MapReduce paper
  • 你或许需要平衡技术深度和电子商务平台,事务处理,行业技术标准,产品技术整合(比如射频识别等等)之间的关系。
ocean wu

购物网站中的"小意思"(掌握用户心理,提高用户黏度) - 0 views

  • 网站:http://www.etsy.com/showcase.php 描述:在物品展示页面,A图点击图片后,显示B图的样式;与第一个类似,但是不同的是图片大小一致,却故意摆放成不同的角度;点击后显示商品在不同角度拍摄的图形和商品的详细信息;并且可以通过此页面进入同类商品。
  • 网站:http://www.thisnext.com/ 描述:首页堆积了各类“小东西”的图例,摆放大小不一,形式不拘一格;鼠标移动上去就可以看到出现气泡窗口,点击后还可以查看更多的详细信息。 引发:给用户(特别是女性)一种进入百货商场的感觉,类别多样化,轻巧、简洁;用图形充当了导航;鼠标移动的缓冲效果没有时间的阻碍;最重要的是首页的效果有点不同,总有一种温馨的感觉;
  • 网站:http://www.kaboodle.com/ 描述:下图A图示清晰的排列出3个产品,可以清晰的看到商品的质地;点击“see details”可以看到商品的详细信息。 引发:从上面A图中的“help me choose(帮你选择)”,可以提供给用户更加理智的选择;从网上购物的发展来看,更加需要中间力量的导向,来指导人们购物。当看不到实际商品的时候,也许“帮你选择”或是“专家指导”,甚至“其他用户经验”更能给用户带来购物体验的安心。其实现在仍然有很多用户担心网购的质量和色泽等,如果中间加上一个检验员(当然,需要没有任何商业牵制的人),也许会放心很多。
  • ...2 more annotations...
  • 网站:http://www.crowdstorm.co.uk/ 描述:“ask the crowd”提供给购买人群之间,或是购买者与专家之间的及时互动,在线交流购买经验和相互的得失! 引发:通过“ask the crowd”,你不仅可以和其他人沟通购物经验,还可以像专家群(“experts”)进行及时询问;做到了及时互动,像是一个社区bbs一样,不仅拉近了购买者之间的距离,还提高了网站购物的专业度。给用户一种安全感!据说国外药品说明书上面都是过敏用户的描述和后遗症,给使用者很好的警惕;那么中国的购物网,会不会在店中挂上标签说“这个鞋子曾经在东北见雪开胶”呢?        并且你可以看到,在B图片中点击图片还可以进行合理的“专家分类”,同时展示用户访谈的数量。
  • 网站:http://www.zebo.com/ 描述:首页是一个小测试,测试你对产品爱好的倾向。 引发:首先吸引用户的不是产品的图片也不是类别的导航,而是一个不错的测试,从第一直觉中就给用户眼球一丝闪光。是个不错的想法,吸引了大量的用户。(由于速度,没有好好体验~) 同样介绍一个音乐网站:http://www.yobo.com/测试你音乐的DNA,也是用一个有趣的因子测试。测试出你的音乐倾向,给用户合理的推荐音乐和推荐临友!这是他最大的亮点,也着实吸引了像我一样好奇又要体验的网民!
1 - 11 of 11
Showing 20 items per page