製作屬於自己的UWP程式: Windows App Studio教學

logobeta

近年,微軟大力推動 UWP 程式的發展,主張只需製作一個程式,便能在 Windows 的電腦、平板、手機上運行,一次過打通多種裝置,例子包括 Facebook。同時,不少人希望透過UWP的發展,借助 Windows 在PC的強大市占率,來改善 Windows 10 Mobile 的app gap問題。

故此,Microsoft 推出了 Windows App Studio,標榜用戶無須對程式編寫有任何認識,只要提供內容來源,就可以在短時間內製作UWP程式,但一直並沒有太多人談論。然而,Man早前成立了 ManHungTech,正好籍此機會嘗試以 App Studio 來製作專屬的reader程式,發現非常好用,於是在此介紹。(大家可以看看小編的製成品作參考,或者給點意見也可以~)

如果你擁有自己的blog、Youtube 頻道或Facebook Page,App Studio 正能幫助你推出一個專屬的 Windows 10 程式,過程簡單、方便。

 

首先,前往http://appstudio.windows.com/en-us

as001

登入你的Microsoft帳戶。

as002

在登入後,便是 My Projects 頁面,此頁會顯示所有經 App Studio 製作的程式,你可以在此管理他們。

如要製作新的程式,請按右方的"Start new project"。

 

as003 as004

選擇你需要的程式類型,而小編的blog屬於 WordPress,所以今次以 “My WordPress Blog" 作示範。

 

as005

在選擇類型後,便輸入程式的名稱,至於preview device 隨意就可,最後製成品定能在三種裝置中運行。

 

as006

製作過程可分為四大部分,分別是 Content、Themes、Tiles及Settings (紅圈所示),而當中Content為最重要。

Content 中,你可設定多個版面,而Home頁則總結所有版面的內容,無法移除。如要修改、刪除其他已有版面,就要按上方大正方形的格仔,而拖放就可隨意修改次序。

如要新增頁面,就在下方 “Add sections" 部分點擊你需要的內容類型 (綠色框所示)。你可按照自己的需要、程式性質作選擇,例如YouTuber 可以選擇 “YouTube"及"Facebook",在app內顯示頻道的最新影片、Facebook Fan Page 的內容;Blogger 就可以選擇"Rss";攝影師可以選擇"Flickr"來展出攝影作品。總之,按照自己的需要來做出配搭,製作多元化的內容。

不過,Facebook 及 YouTube 的設定較複雜,而詳細教學請參閱http://appstudio.windows.com/en-us/home/howto#addingsection

 

as007

至於 “Themes" 部分,你可以依照自己的風格和喜好作出設計,或使用預設的風格亦可。

同時,你需要在 “Tiles" 部分中上載及調整程式 Live Tile,如果本身沒有特別要求,小畫家都可以製作出不錯的Live Tile。如果本身的Blog、YouTube 頻道、Facebook Page 有Logo 的話,這更加不是一個難題。

此外,在 “Setting" 中,你要填寫基本的資料。

小提示: 在完成每一個項目後,記得(很重要,所以要說三次~)要按右方的"Save",才進入下一項目。

as008

在完成所有的設計及設定後,就需要製作package,正如禮物準備後亦要入盒,才能送給人。

按"finish" (位於"save"的右邊)後,便是 “Generate"。先按藍色的"Generate"一下。

 

as012

在"Generation type"的兩個選項都開啟,並輸入你的版本(一般為1.0.0.0),然後按下方的"Generate"。"Publish packages" 是用來提交給 Windows Store,而 Installable Packages 則供自己測試、安裝使用。

接著,煩請耐性等待數分鐘,時間長短視乎程式內容多寡而定。

 

as013

完成 generate 後,便出現三個package,現在就為大家一一介紹啦。

左方的 Source Code 是給專業的開發者,該檔案可以在Visual Studio 中開啟 (Visual Studio是用來製作Windows app 的專業工具),以再作修改及改善,但此選擇需要一定的 coding 知識,故小編不建議新手嘗試。

中間的 Installable Package 是用來測試製成品,只要先在運行 Windows 10 的電腦或手機安裝 “Windows App Studio Installer",再開啟盒子圖案的連結,便能在自己的 Windows 10 裝置上運行程式,進行測試 debug。如要修改,只要返回 “My Project" 中進入你的project,便能作出修改,然後再 generate 一次,無須重新製作。

至於右方的 Publish Package,就是用作在 Windows Store 對外發布。下載 zip file 後,要先自行解壓,file中包括兩個app,分別為pc版及手機版,以及兩張screen shot,給上架時用。

 

最後,程式發布的方法可參閱http://appstudio.windows.com/en-us/home/howto#deploy

希望大家能夠製作屬於自己的app吧! (也請多多支持ManHungTech的 app吧,Windows 10 PC及手機同時適用)

 

(此文同時刊於We Love Windows. HK)

 

發表迴響

在下方填入你的資料或按右方圖示以社群網站登入:

WordPress.com 標誌

您的留言將使用 WordPress.com 帳號。 登出 /  變更 )

Google+ photo

您的留言將使用 Google+ 帳號。 登出 /  變更 )

Twitter picture

您的留言將使用 Twitter 帳號。 登出 /  變更 )

Facebook照片

您的留言將使用 Facebook 帳號。 登出 /  變更 )

w

連結到 %s

Create a website or blog at WordPress.com

向上 ↑

%d 位部落客按了讚: