Archive for November, 2008

视觉设计常见误解

Friday, November 28th, 2008

原文来自网页设计知识库
有機會研究對視覺設計作用的常見誤解,這些誤解仍然盛行於行政主管、產品主管,工程經理和市場專家中。設計團隊成員如何說明這些認識是錯誤的?又該如何向同事和老闆展示視覺設計真相?

視覺設計師在特定產品領域或職業生涯中會面對各種困難,但有三種誤解頻繁發生:

  • 視覺設計是美化產品;
  • 突出顯示能改善視覺設計;
  • 可以分割評估視覺設計。

視覺設計是美化產品

這種信條可能起源於工業時代的設計理念引入。從那時起,產品以前所未有的方式進行設計,並形成風格。Raymond Lowey等工業設計師對呆板產品進行美學設計,而聲名大噪。

視覺設計固然能美化產品,但其與人交互的潛能早已超越美麗外觀。通過組織視覺元素,設計師可以傳達回答關鍵問題的核心信息:

  • 這是什麼?
  • 怎麼使用?
  • 為什麼要使用?

回答這些問題是功能和可用性的關鍵組成部分,尤其是對於交互產品。舉些例子來說明:

圖1到圖3,某個網絡應用工具,相同基本設置的三種表現方式,字體、顏色、漸變和圖片都相同。三者主要區別是頁面元素組織方式不同。這種區別表明該網絡應用工具存在三種主要使用方法。


圖1、網絡應用工具設計示例

圖1,表現方式清晰顯示出主要功能——查找客戶聯繫信息;其次,用戶可以編輯、刪除或者增加備註。圖2,重點是顧客和公司之間的交流;其次,用戶可以查看、編輯和刪除聯繫人信息。


圖2、相同網絡應用工具,不同視覺組織

圖3,關注點放在編輯客戶信息上。查看聯繫人信息和跟蹤正在進行的會話功能被弱化。


圖3、另一種視覺組織

相同應用工具,三種不同視覺組織,三種不同主操作:查找聯繫人信息、管理客戶交流以及維護客戶記錄。每個例子中,影響視覺設計的因素大體一致:顏色、字體、漸變和圖片。

顯而易見,視覺設計不僅是美化此工具。它傳達工具的核心功能:它是什麼?如何使用?為什麼要使用?,而同時有美化了界面。

能讓這個更突出嗎?

很多網站都喜歡把logo做得比較大,客戶和老闆常要求視覺設計師著重強調頁面上某些元素。這類評論有時可以幫助我們發現設計中的最重要元素,但也常引發視覺設計的另一常見誤解:改善網站視覺設計,通過加大、加粗、變紅或同時使用三種方法來實現!

頁面任何元素的相對重要性都是由其周邊元素決定。白色頁面放上紅色圓圈,會吸引很多注意力。但把紅圈放在10個粉色圓圈旁就不會吸引那麼多注意力。突出重要元素是整體設計的一個過程,並不是改變任何單一元素。給予單個元素額外視覺權重會破壞佈局平衡,攪亂相關元素、主操作等之間的關係。

要是滿足客戶和老闆每個強化某些功能的需求,頁面所有元素都會去搶著吸引用戶注意——結果就是都得不到注意。圖4和圖5,兩個互聯網瀏覽器下載頁面。Firefox頁面,下載瀏覽器號召很明顯,頁面其他元素——Thunderbird、Mozilla商店和最新內容——沒有干擾。


圖4、Firefox下載頁

圖5,Flock下載頁面強調了許多不同元素,設計團隊決定提供四個下載入口——右上角、左側菜單底部、新聞面板右上角和頁腳。如果頁面上沒強調那麼多其他元素,Flock下載頁面或許可以和Firefox一樣只用一個下載按鈕。


圖 5、Flock下載頁

可以分割評估視覺設計

沒有從設計整體考慮,而強調單個元素會非常困難,同樣做出孤立改變也很難。但是視覺設計師收到的大部分反饋集中在孤立元素上:可以把Logo做大點嗎?能改變標題顏色嗎?這裡可以換張圖嗎?

這些的確幫助設計師明白用戶和老闆想要的東西,但他們沒有考慮優秀設計必需的整體分析。改變顏色需要反覆思考整體配色,因為設計師必須確保顏色對比明顯,才能突出關鍵操作。改變圖片意味著同時要改變周邊元素,因為原圖片形成的焦點可能已不存在。諸如此類。

產品總體視覺設計源於謹慎平衡頁面元素——傳達產品功能、可用性和優勢的關鍵信息。如果要調整一項元素,設計師需要重組全局,重歸平衡。孤立設計決策無法保持修改前後整體一致。

孤立評估基於互聯網的產品特別脆弱。單個產品可以進行獨立測試,所以產品團隊就會假設”這些產品結合在一起也會很好”, 而常常把單獨表現良好的產品組合起來。圖6,孤立決策的後果。

在這個eBay頁面,頁頭水桶測試(bucket testing)表現良好,PayPal保護機制的logo在焦點小組(focusgroup)中獲得好分數,攝影物品宣傳也獲得不錯點擊流,但把三個元素綜合到一個頁面上,並沒有形成有效設計。事實上,頁面上很多元素似乎互相競爭,互相干擾。


圖6、eBay意大利首頁

希望這些例子能解釋對視覺設計角色的一些常見誤解。只有同事和老闆能直接體驗視覺設計潛能,他們才會相信視覺設計絕不僅僅是設計樣式、顯化元素或做出孤立決定。

交互式电视与RIA

Thursday, November 27th, 2008

最近坐公交车
交通广播里不停点的播放交互式电视的广告
号召大家都来使用交互式电视

我在想,交互式电视提供的无非是一个机顶盒,然后通过电视机将图像显示在荧屏上罢了
那么利用这个终端,除了VOD,我们还能做什么呢?

互联网将人与人之间的联系大大加强了
它所提供的途径主要有:静态的文本(blog,论坛,社区),动态的即时消息(IM),网络电话(VOIP),视频通信(摄像头)——可能还有其他的。
那么这些功能能否基于机顶盒实现呢?

我觉得对目前的中国来说,这样的设备价格肯定比一台电脑要便宜,对普通网民很适用(虽然电脑现在也比较便宜,但是如果让通了数字电视的农户买电脑,还真不如买个机顶盒,最起码使用简单,价格便宜)。而且有利于互联网的发展,有利于知识和信息的传播——想想看,任何地方,只要能够接通数字电视,就能接入互联网,获取足够的信息,支持自身的学习,娱乐等等~

如果上述的功能能基于机顶盒实现,鉴于机顶盒自身存储能力的限制,所有的数据基本都是来自于互联网的,这时,云计算就有了用武之地。

此外,利用RIA技术(机顶盒内至少得有一个嵌入的浏览器吧)为用户提供简单便利的基于WEB的交互方式肯定也是不可缺少的。

看来,RIA技术真正的春天还没来到~

FLASH视频编码的生态系统

Tuesday, November 25th, 2008

原文来自adobe

Video on the web is exploding. In May 2008, 142 million Internet users watched 12 billion video clips, spending an average of 228 minutes per month watching video online. An increasing number of content owners are putting their video content on the web. With 84% of online videos viewed using Adobe Flash technology, Flash is the number-one format for video on the web.

In addition, video consumption is changing: record numbers of people are tuning in to live events such as sports and news—and consuming massive amounts of video on demand, such as catch-up television and user-generated content. Consumers are increasingly demanding DVR-like features that match their living room experience.

The question rises, as a content creator or video producer, how do you put your video online? This article is a high-level overview of publishing video for Flash. I first walk you through the video publishing process, the differences between live video and video on demand, the Adobe products that support each workflow, and the video encoding technologies they use. Finally, I list some of the many Adobe partners you can engage with to help you publish your video to the web.

Understanding the process

At a very high level, video for Flash involves the following process (see Figure 1):

  • Capturing the video
  • Encoding into a format for delivery
  • Delivering the video over the Internet
  • Playback on the end user’s machine

The process of publishing video for Flash, from capture (left) to viewing (right), offers choices of live or on-demand video and various options for encoding and serving the video to users.

Figure 1. The process of publishing video for Flash, from capture (left) to viewing (right), offers choices of live or on-demand video and various options for encoding and serving the video to users.

Why do you need to encode? At the most basic, it’s because raw video is huge. If you don’t encode your video, it will be too big to transmit over the Internet to your viewers. The process of encoding involves making the video as small as possible while maintaining the highest quality possible (see Figure 2). It’s a delicate balance. You can get an amazing looking video at 4 Mbps (that’s the video bit rate—how many bits get transmitted every second) and 1920 × 1080 pixels, but you would need an Internet connection that is over 4 Mbps to stream it, or else download a file over 1.5 GB to view it. Conversely, you can easily create a video file that is only 100 kbps, but it may look so poor that no one wants to watch it.

Encoding involves choices between quality and file size.

Figure 2. Encoding involves choices between quality and file size.

Encoding live video

Live video means that you’re capturing, encoding, and delivering video in real time (see Figure 3). Think of a sports game that is being streamed on the Internet while it’s happening. Adobe offers a spectrum of options for capturing and encoding live video, whether you’re dealing with user-generated content or higher-quality video sources.

Capturing, encoding, and delivering live video requires real-time processing at every step.

Figure 3. Capturing, encoding, and delivering live video requires real-time processing at every step.

User-generated content

Since 2001, Adobe Flash Player has had the ability to capture and encode H.263 video and Nellymoser audio. In Flash Player 10, you can also capture audio in the Speex codec, an open-source codec specifically designed for speech that provides higher-quality audio for voice chat applications. This functionality can allow any user to capture video from a webcam and share it through Flash Player. Examples of this include Yahoo! Live, UStream, and Woome. Even YouTube uses this functionality to quick-capture video content. While this makes it really easy to use, the quality is constrained to H.263 video, which means that the video quality is limited compared to the newer H.264 and VP6 codecs.

Higher-quality video

Flash Media Live Encoder is a free application from Adobe that can use a webcam, video capture card, or any FireWire or USB device on a computer running Windows OS to capture raw video input and encode it into VP6 or H.264 video. It is intended for technical producers or other media producers to capture video for a live event. Flash Media Live Encoder can either directly stream video to a Flash Media Server, or save a file locally for later downloading or streaming. Flash Media Live Encoder can also encode audio into either Nellymoser or MP3 audio. With an additional plug-in, available from MainConcept, Flash Media Live Encoder can also encode into AAC or HE-AAC audio formats.

Encoding video on demand

Video on demand means an event that occurred in the past that you can watch whenever you want. A good example is a television catch-up service where you can start watching a show whenever you want, and it is posted after the show has actually aired.

Unlike live video, video on demand gives you more time to experiment and adjust the encoding parameters to get maximum quality at a minimum bit rate. In many cases you can edit the video, add visual effects, and take advantage of tools such as those included in Adobe Creative Suite 4 Production Premium (see Figure 4). The key difference is that, generally, for live video you ingest video feeds while for video on demand you most often work with video files directly.

Video on demand allows for processing video files with Creative Suite 4 applications to edit and optimize them before posting to a video server

Figure 4. Video on demand allows for processing video files with Creative Suite 4 applications to edit and optimize them before posting to a video server.

Just as with live video, Adobe offers a spectrum of options for encoding, editing, and serving video on demand. Adobe Media Encoder, a separate software application included with Adobe Premiere Pro CS4, saves you time by automating the process of creating multiple encoded versions of your source files and Adobe Premiere Pro sequences. Set up multiple items for encoding, manage priorities, and control advanced settings for each item individually.

Adobe Media Encoder also
encodes compositions from Adobe After Effects software when it’s installed as a component of Creative Suite 4 Production Premium. Use any combination of sequences and clips as your source media and encode them to a wide variety of video formats, including FLV and F4V, Windows Media, MPEG-2, H.264, QuickTime, and more. Desktop encoding solutions, such as Adobe Media Encoder, are often closely integrated into the broader production workflow and are targeted at single users or small production facilities.

Today Adobe introduced Adobe Flash Media Encoding Server, a server solution designed for large teams or large volumes of content. Flash Media Encoding Server ingests a large set of files, but transcodes only into FLV and F4V formats. Additionally, Flash Media Encoding Server includes a number of APIs. This means that it can be integrated into automated workflows, such as those you might see in a user-generated scenario, where you want to ingest files from users in a number of formats but deliver all video in FLV or F4V to be able to take advantage of the 98 percent penetration of Adobe Flash Player.

Engaging an Adobe partner

In addition to the products available from Adobe, a broad partner ecosystem provides a number of complementary solutions. For live video, some partners provide capture cards that can be used with Flash Media Live Encoder, while others provide software and turnkey solutions that customers can use to quickly and easily deliver live video to Flash Player (see Table 1). For video on demand, Adobe relies on this partner ecosystem to provide a number of complementary solutions (see Table 2). Certain differentiators that our partners can provide may include the following:

  • Support for two-pass VP6 encoding
  • Enterprise-scale solutions that output a number of video formats, not just VP6 and H.264 formats
  • Hardware-based solutions

Table 1. Flash Media Solution Providers for live video capture and encoding

Partner Solution type Format supported
Software Hardware Services VP6 H.264
Anystream
Dicas
Digital Rapids
Inlet HD
iStreamPlanet
Kulabyte
Multicast Media
On2
Viewcast

Table 2. Flash Media Solution Providers for video-on-demand encoding and transcoding

Partner Solution type Format supported
Software Hardware Services VP6 H.264
Anystream
Ateme
Dicas
Digital Rapids
Envivio
Inlet HD
iStreamPlanet
Media Excel
Multicast Media
On2
Rhozet
Ripcode
Sorenson Media
Telestream

Note: For an up-to-date list of partners, visit the Flash Media Server ecosystem partners page.

Where to go from here

I hope this article has helped you understand the basic workflow of video for Flash, the differences between live video and video on demand, and how Adobe and our partner solutions provide a number of options to help you meet your video encoding needs.

To learn more about video for Flash, visit the Video Technology Center in the Adobe Developer Connection. Also watch the video below, where senior media producer Julie Campagna explains the basics of getting your video on the web:

To learn more about the Adobe products mentioned in this article, visit the respective product pages:

About the author

LaurelReitman is the senior product manager for Flash Media Solutions in theDynamic Media Organization at Adobe Systems, where she drives thestrategy and direction for Flash Media Live Encoder, which enablesusers to encode live video to stream through Flash Media Server. Laurelalso drives the overall strategy for the Adobe live streaming business.In addition, she is responsible for Flash Media Encoding Server, whichenables customers to transcode video for delivery to Flash Player.Prior to joining the DMO, Laurel was the senior product manager forAdobeplatform technologies, working with the Flash Player, Flex, Adobe AIR,andAdobe Reader teams to help align key strategic initiatives. Prior tojoiningAdobe, Laurel was a lead program manager at Microsoft working on webtechnologies andapplication platforms. Laurel holds a BS in Electrical Engineeringfrom Yale University.

Stratus:Adobe RTMFP服务器

Monday, November 24th, 2008

一开始看到消息说flash player 10 支持P2P,不过需要相应的服务器支持,感觉挺好,这下可以只用FP而不用下载其他软件共享文件或者给朋友播视频了。

可是,刚从Startus的FQA中看到这么一段:
What new functionality does Adobe Flash Player 10 and AIR 1.5 enable?By using RTMFP, applications that rely on live, real-timecommunications, such social networks and multi-user games will be ableto deliver higher quality communication solutions. Flash Player 10 andAIR 1.5 will also enable end-users to connect and communicate directlywith each other using their computer’s microphone and webcam. FlashPlayer 10 and AIR 1.5 will not support file or document sharing.

不支持文件传输。。。。。

What are the limitations of RTMFP in Flash Player 10 and AIR 1.5? Flash Player 10 and AIR 1.5 will not enable swarming, multicast orbroadcast quality live video. It will only enable communication fromthe voice and video devices native to your computer (e.g. microphoneand webcam) and enables application developers to send ActionScriptdata messages directly between Flash Player and Adobe AIR clients.

支持在客户端间发送AS消息数据,那么是否可以将本地文档或者视频压缩后传输到另一端,再解压出来呢?
可惜FP还有一个硬伤,单线程,不支持多线程~如果这样实现的话,在解压或压缩的时候是什么都不能做的!

想想,如果要给别人传输一个很大的文件~~等待吧!

不知道微软有什么好的解决方案没~

将敏捷团队从基础工具环境搭建中解脱出来

Wednesday, November 19th, 2008

原文来自InfoQ

“敏捷宣言”中提到:“个体与交互胜过流程与工具”。然而,对于敏捷团队来说,正确的工具搭配和流程可以起到催化剂的作用。采用敏捷的组织越来越多,而且很多团队都是在分散的地点工作;敏捷团队要想成功,良好的基础工具环境必不可少。要想快速搭建这个环境却常常使人挠头,因为要让多种工具协同工作。不过,现在有了像 Buildix和Assembla这样的工具,要感谢它们。因为有了它们,面临环境构建问题的团队可以快速通过工具设置阶段,进入到正常的工作流程。

Jose Noheda指出

相信我,试图从头搭建这样的[敏捷]工具环境很困难;但是事半功倍。

使用Buildix,只要通过一个安装程序,各种敏捷工具就一步到位了。Buildix中包括:

Buildix可以部署在Ubuntu上,也可以直接从LiveCD上使用。

Assembla做出了进一步的努力,他们提供基础工具宿主服务,可以让敏捷团队快速启动。他们提供的在线空间,允许成员数量不受限制的团队在其中协作、沟通和编码。其中包括如下标准工具:

  • 一个简单的Wiki
  • 信息公告板
  • Subversion,用来做源代码控制
  • Trac,用来做wiki和缺陷跟踪
  • 时间报告
  • 在线聊天
  • 项目里程碑和图表
  • 项目仪表板
  • twitter

其他特性还有:成员档案、品牌标记和职员列表。敏捷团队可以选择使用公开的免费版本,其中会公开项目细节;或是使用有附加特性的付费私有版本。

关于该系列套装,KillerStartups迫不及待要告诉大家的是:

Assembla.com的用户可以得到免费的工作空间,配备一切需要用来组织和装备地点分散团队的工具;而且这些都是以Web 2.0d的形式发布的,只需60秒的注册过程。最受欢迎的特性是免费的Subversion,带有trac以及一个方便的实时提醒系统。

像KillerStartups这样的创业公司,总想让敏捷团队从设置基础工具的烦恼中摆脱出来。上述两个工具包中涵盖了最常用的敏捷工具,使得敏捷团队从一开始就可以更具效率。