開(kāi)源原型設(shè)計(jì)工具Indigo Studio發(fā)布v2.0 全面支持HTML5

Indigo Studio是由infragistics所開(kāi)發(fā)的一款免費(fèi)開(kāi)源的UI原型設(shè)計(jì)和交互設(shè)計(jì)工具。幫助你快速而簡(jiǎn)單地創(chuàng)建活生生的UI原型。它的每一步都保持以用戶體驗(yàn)為中心。有了Indigo Studio你可以用超過(guò)100個(gè)不同的場(chǎng)景、線框（內(nèi)置交互控件以及桌面、網(wǎng)站和移動(dòng)應(yīng)用的原型）創(chuàng)建腳本，全部不需要代碼。

如今更新至Version 2，有了諸多新特性，為移動(dòng)設(shè)備設(shè)計(jì)原型變得再簡(jiǎn)單不過(guò)了。有了對(duì)運(yùn)行HTML5的設(shè)備的全面支持（包括iOS設(shè)備）。用戶能夠利用Indigo Studio所支持的觸控手勢(shì)，支持PDF的文檔設(shè)計(jì)、真實(shí)使用環(huán)境的腳本設(shè)計(jì)、快速原型交互應(yīng)用設(shè)計(jì)，創(chuàng)造出功能齊全、充滿生氣的UI原型。下面，讓我們來(lái)看看更新詳情。

Indigo Studio v2.0專為移動(dòng)設(shè)備設(shè)計(jì)

到目前為止，Indigo Studio v2最重要的新增特性就是所有我們對(duì)移動(dòng)設(shè)備的新的支持。

目標(biāo)平臺(tái)

你現(xiàn)在可以選擇一個(gè)目標(biāo)平臺(tái)，默認(rèn)的是“Generic”，這是Indigo v1里面所有的。當(dāng)你還不為平臺(tái)發(fā)愁的時(shí)候，它對(duì)于快速草圖很有幫助。它同樣還可以用作桌面OSes和其它很多事。

我們所新增的是這些其它的選擇——瀏覽器和眾多的移動(dòng)設(shè)備。選擇其中之一將添加該目標(biāo)的“chrome”在設(shè)計(jì)界面，但它遠(yuǎn)不止這些。

我們調(diào)用新的chrome相關(guān)材料，“視口”是華而不實(shí)的，雖然它會(huì)對(duì)設(shè)置環(huán)境很有幫助。你可以改變視口chrome透明度，如果仍然覺(jué)得礙眼，甚至可以直接隱藏它。

視口也支持移動(dòng)設(shè)備的方向。

視口給予你目標(biāo)的可見(jiàn)框架，并且?guī)椭x什么是可滾動(dòng)的/可搖動(dòng)的。如果你使用新的iOS目標(biāo)之一，你將擁有一個(gè)基于設(shè)備尺寸的的已修復(fù)視口。但是，如果你使用瀏覽器或Generic設(shè)備之一，你可以指定目標(biāo)視口尺寸。

一旦你設(shè)置了視口尺寸，你就可以將canvas（白色bit）拖出視口使得目標(biāo)能夠滾動(dòng)/搖動(dòng)，一旦你這樣做了，你就可以拖動(dòng)視口本身來(lái)指定你想讓什么可見(jiàn)。

選擇，當(dāng)你預(yù)覽/運(yùn)行或共享你的目標(biāo)原型時(shí)，我們將在瀏覽器中展示目標(biāo)視口，舉個(gè)例子，如果你在桌面瀏覽器查看一個(gè)手機(jī)原型，我們將把原型放置到手機(jī)chrome中，這有助于給你你對(duì)那些原型有更接近真實(shí)的體驗(yàn)，即使是在瀏覽器中。但當(dāng)你在一個(gè)實(shí)際存在的手機(jī)上運(yùn)行同樣的原型，我們會(huì)隱藏該chrome——因此，就好像它是在那臺(tái)設(shè)備上運(yùn)行一樣。

新的觸控手勢(shì)

當(dāng)然，當(dāng)你將觸控手勢(shì)作為目標(biāo)時(shí)，支持目標(biāo)移動(dòng)平臺(tái)還有更多的意義。當(dāng)你用v2指向一個(gè)移動(dòng)平臺(tái)時(shí)，Indigo智能地為你的原型提供“touch-specific”（特定觸控）手勢(shì)。當(dāng)你在桌面瀏覽器查看原型時(shí)，這些手勢(shì)能夠被模仿（比如點(diǎn)擊和快速拖動(dòng)），但很顯然它們?cè)谝苿?dòng)設(shè)備上才有最佳表現(xiàn)。對(duì)于定向手勢(shì)，你可以選擇方向并創(chuàng)建互動(dòng)。

屏幕到屏幕的轉(zhuǎn)換

如果你試圖在Indigo v1中創(chuàng)建移動(dòng)原型，你必須模擬屏幕到屏幕的轉(zhuǎn)換使用基于狀態(tài)的動(dòng)畫(huà)。你依然可以那樣做，但是新嵌入的屏幕到屏幕轉(zhuǎn)換使得原型設(shè)計(jì)常見(jiàn)的移動(dòng)轉(zhuǎn)換更加簡(jiǎn)單。你不能在v1中實(shí)現(xiàn)Flip,但現(xiàn)在你可以了！

內(nèi)置iOS支持

即使這在v2列表中是一個(gè)“bullet point”，它也是很大的一個(gè)，因?yàn)槲覀儾皇墙o你漂亮的圖片，我們是給你互動(dòng)控件，超過(guò)30種新的iOS控件，超過(guò)15種新的iOS圖標(biāo)。特別支指定目標(biāo)iOS，很多“quick-drop”定位有助于共同元素加快iOS原型。

你可以看到這遠(yuǎn)不只是一組簡(jiǎn)單的模板，我們希望你能看到它顯著加快你速寫(xiě)iOS原型的能力。

Indigo Studio v2.0支持導(dǎo)出為PDF

一個(gè)倍受關(guān)注和呼吁的特性便是將Indigo原型直接導(dǎo)出為PDF。在v2中，我們新增了次特性。棘手的部分是如何轉(zhuǎn)換一個(gè)交互的、多路徑的原型到一系列逐頁(yè)文檔格式。我們將為你完成這一部分。Indigo Studio分析你的屏幕狀態(tài)流并將提供一波接一波的分解。因?yàn)闋顟B(tài)是基于用戶的互動(dòng)自動(dòng)命名的，在很多情況下，這是可以理解的。

在注釋方面，我們支持可選的內(nèi)置注釋工具。這帶來(lái)一個(gè)好處就是：你添加的注釋是（可選擇地）可見(jiàn)的，無(wú)論是在運(yùn)行的原型中還是在導(dǎo)出的文檔中。

Indigo Studio v1.X亮點(diǎn)回顧

共享你自己的服務(wù)器——這使得對(duì)于indigo用戶很重要的兩個(gè)腳本成為可能——在防火墻之后自行分享原型，當(dāng)你的原型被移除時(shí)控制，并“更新到位”，你不需要為每次更新獲取新的URLs。

改進(jìn)的導(dǎo)出——伴隨著更多的共享選項(xiàng)，我們圍繞著“導(dǎo)出”添加了更多的控制（和一個(gè)更好的UX）包括導(dǎo)出選擇性的部分項(xiàng)目以供他人繼續(xù)處理，和一個(gè)新的“Quick Snapshot”（快照）全局特征來(lái)快速抓取圖像。

預(yù)覽/運(yùn)行的更多選擇——你現(xiàn)在可以選擇從你的原型home、當(dāng)前屏幕開(kāi)始狀態(tài)、當(dāng)前狀態(tài)來(lái)運(yùn)行，并且“try interaction”（嘗試互動(dòng)）在之前的狀態(tài)啟動(dòng)，為了快速嘗試你正在設(shè)計(jì)的互動(dòng)。

新的密碼框——添加一個(gè)密碼輸入框如同拖動(dòng)和放下一樣簡(jiǎn)單。

分散/隔開(kāi)我們的元素——你現(xiàn)在可以輕松地將選擇的元素分散/隔開(kāi)了。

Storyboard增強(qiáng)——你只需簡(jiǎn)單地雙擊來(lái)開(kāi)啟新的屏幕，這將很有助于文字示意圖交互。