發表文章

目前顯示的是 2013的文章

重點筆記 Hackers and Painters

圖片
我們的時代是程式設計師主導的時代,而偉大的程式設計師就是 hacker。Hacker 追求的三個特色,好玩,高智商,探索精神,而不是實用性和金錢。Hacker 倫理之二,你可以用電腦創造美和藝術,使生活更美好。惡意入侵電腦系統的人應該被稱為 cracker,hacker 是指那些最優秀的程式設計師。應該把 hacker 和 畫家 當作同一種人看待,他們都是創作者。行為怪異和憤世嫉俗的人比普通人更可能成為 hacker。Hacker 的最高境界是創造規格。賺錢的軟體往往不是好玩的軟體。Hacker 如何才能做自己喜歡的事情?答案是像音樂家一樣,找一份養家糊口的“白天工作”。面試程式設計師的時候,主要關注的就是業餘時間他們寫了什麼軟體。應該定期的從頭開始,而不要長年累月在同一個項目上,試圖把最新想法加進去。Hacker 可以通過觀看優秀的程式學習程式設計,不是看它們的執行結果。一幅畫是逐步完成的,過早優化是一件危險的事情。Hacker 就像畫家,工作起來是有心理周期的。有時候你有了一個令人興奮的新項目,願意為它一天工作16個小時。但過了一陣子又會覺得無聊,對所有事情都提不起興趣。正確的合作方法是將項目分割成嚴格定義的模塊,每一個模塊由一個人明確負責。從他人的角度思考問題正是成功的奧秘所在。判斷一個人是否具備 “換位思考” 的能力有一個好方法,那就是看他怎樣像沒有技術背景的人解釋技術問題。在達芬奇的年代,繪畫並不是一件很酷的事情,達芬奇用自己的工作推動繪畫成為一種偉大的表達方式。同樣,程式設計到底能夠有多酷,取決於我們能夠用這種新媒介做出怎樣的工作。只有深入了解當前的技術,hacker 才能構想下一代技術,知識產權的擁有者也許會說不,我們不需要你的幫助,我們自己就能開發下一代技術。他們錯了,在電腦工業歷史上,新技術往往是由外部人員開發的,所占比例高於內部人員。如果我們不可以研究當前的技術,不能思考如何改進它,那麼我們怎樣才能開發出新技術呢?如果 hacker 有自己的節日,那就是 4 月 1 日愚人節,你可以放心地作弄其他人。專制國家會腐敗,腐敗國家會貧窮,貧窮國家會弱小。不要在半夜發佈程式碼,然後回家睡覺。管理企業其實很簡單,只要記住兩點:做出用戶喜歡的產品,保證開支小於收入。你就會超過大多數創業公司,隨著事業發展,你自己就能琢磨出其他的訣竅。幾個 hacker 搞懂…

Trello workflow

圖片
團隊開發的網頁遊戲《末日少女》已經上市快兩個月了,成績比當初想像中還好,相較於 Gu Morning,這次《末日少女》的開發學到很多寶貴的經驗,稍微鬆口氣之餘,也有許多需要檢討改善的地方,而《末日少女》Mobile 版其實也已經開發好一陣子了,最近這個專案只剩下我一個人交到我手上負責,趁這個機會導入一些新的開發方式,也 PO 上來分享心得。
這篇文章會講什麼?HtpChat - 開發團隊的 Log 整合中心。Trello - 團隊的專案管理小白板。Git flow - 最佳程式開發流程。Jenkins - CI(持續整合)建構工具。 HipChat
HipChat 是一款跨平台團隊溝通工具,為了節省開會浪費的時間,通常會使用 LyncSkype 這類通訊軟體,而 HipChat 除了該有的聊天功能,歷史查詢,附件上傳,@mentions 通知之外,最棒的是它可以整合許多服務,例如 GitHubHerokuJIRA 等,將所有開發上分散的訊息統一管理,方便團隊隨時瞭解狀況,而接下來這篇文章會講到如何整合 TrelloGitHubJenkins

Trello
不同於一般市面上複雜的專案管理軟體,Trello 是一個簡單易用的 Scrum board,之前 Development Tools 這篇文章有稍微介紹,而我目前就是使用它來管理新專案,試用兩個月下來,感覺還不錯。

Trello 主要由 Board,List 和 Card 組成,如上圖所示,目前我將開發板分成五個 List:
Backlog - 所有企劃開出來的功能會集中在這個 Backlog List,並按照預計完成日期排序。To Do - Backlog 中的功能如果已經準備好企劃文件和美術檔案,那卡片就會移到 To Do 待命。Doing - 正在實作中的功能會從 To Do 移至 Doing,建議每個人只留一張卡片在這。Done (vX.X.X) - 下一版要完成的功能,在 Doing 完成的卡片會移到 Done,待產品發佈後會從 Done 改為 Live。Live (vX.X.X) - 已經上線的功能 List,可以隨時使用封存,讓開發板保持乾淨。 vX.X.X 為版號。
每張 Card 還可以根據屬性標上自訂 Label,例如 feature,bug 等。 Zapier 由於 Hi…

COSCUP 2013

圖片
今年是第二次參加開源人年度聚會 COSCUP,很幸運的在 47 秒內搶到限量 500 張的門票,和去年比較不一樣的地方:
場地從中研院換到國際會議中心,應該是因為人數的關係,不過我猜 TICC 沒有下次了(笑),期待明年的小巨蛋(誤)。八軌議程,同個時段最多有八場演講可以選擇! 分享一些這兩天簡單的筆記:
DAY 1 第一天有點小遲到,好險大會準備的 NFC 識別證快速通關,加上場地夠大,還很多位置可以坐。
Open Data Initiatives for Taiwan 一開始開場是由 行政院政務委員 張善政 演講,主要是聊一些台灣政府目前 Open Data 的情況,認識了兩個網站:
data.gov.twg0v.tw 前者是政府的資料開放平台,後者是最近很紅的「寫程式改造社會」零時政府。
座談會:Open Data 面面觀莊庭瑞:政府 open data 才有機會知道資料是錯的,如果不公開,永遠沒有人會發現資料有錯。 Open Source Engine powering Big Data in the Cloud 完全聽不懂(失落),不過外國人念 Hadoop 聽起來好像在念 ぱるる

開源硬體有什麼意義? Facebook 的 OCP (Open Compute Project) 讓很多人開始對 Open Source Hardware 抱有憧憬,認為可以像 Open Source Software 一樣,激盪出很多新的設計和發明。事實上是這樣的嗎? Open Software VS Open Hardware
擴充成本,硬體比軟體還高很多。軟體語言本質一樣,易學,硬體相反。軟體易模組化 OCP (Open Compute Project)
只公開規格,沒開源。規格只適合大用戶。 最後講者 Ben 介紹自家開發的服務 Evdience Taiwan,主要是透過電話來錄音,適合報料蒐證。
g0v.tw 零時政府:從開放源碼到開放政府
講者為零時政府創辦人 clkao,以 Open Source 比喻政府的觀點還蠻有趣的:
民主 = 接受 patch立委 = committer政府 = code in action公民社會 = open source 在成果展示中,我最喜歡失蹤兒少開放資料平台計畫這個點子,404 頁面與慈善公益結合。
當設計遇上opensource…

我想做的遊戲

圖片
進入遊戲業兩年多了,但網誌上跟遊戲相關的文章卻很少,所以在截稿前夕,就來寫一篇跟遊戲有關的文章吧!
雖然這兩年間學到不少遊戲開發的相關知識,但這篇不寫技術,這篇純粹想聊聊「自己想做的遊戲」。
每位遊戲開發者一定都會有自己想做的遊戲,但絕對不會是目前你工作上的這款(笑),雖然嚮往成為獨立遊戲開發者,但看過半路叛逃的分享後瞭解,獨立開發遊戲並不容易,儘管如此,還是想分享自己心中的那一款完美遊戲。

我想做什麼樣的遊戲呢? 簡單來講,有三個要素:
遊戲 X 生活服務 X 教育 遊戲?生活服務?教育?在仔細解釋前,先介紹幾款遊戲給大家認識:
OZGreed Island動物之森神奇寶貝 OZ OZ 是在日本動畫 夏日大作戰(2009) 中的一個虛擬世界社交網站,
「OZ」與第二人生概念相似,但依照自己的經驗來講「OZ」應該更接近日本社交網站mixi的想法。
由於「OZ」系統與現實世界之間有著極高的整合度,來自世界各地的許多企業與政府組織都於此設有部門來進行互動,這使得在作為虛擬世界的「OZ」混亂也陸陸續續影響到真實世界的生活。
雖然是虛構的故事,但 OZ 中有幾個特色還蠻有趣的:
OZ 世界中擁有10億人口 (比 Facebook 多1億),幾乎是每個人都有一組帳號。Client 端有 PC,手機,TV 等,與近年來跨平台特性一致。行政進駐,遊戲世界可以與現實服務做連結,例如:納稅,防災..企業進駐,直接在遊戲中的商城購物,也是一個與現實服務連結的商務平台。即時翻譯多國語言,這個感覺快實現了。 其中行政與企業這塊,就是我上面提到的遊戲結合生活服務,近年網路服務也逐漸往資料開放(API)的方向發展,要在遊戲世界中實現這些服務已經不是夢想。
Greed Island貪婪之島 是日本漫畫《Hunter × Hunter》中的一個虛擬遊戲。
這是一個把現實世界當作遊戲的一個概念,遊戲中的角色,道具,事件都是用漫畫中的「念」製作出來的,當然,我們不可能用念能力來製作遊戲(笑),不過其實也可以把它看作擴增實境(AR)的延伸應用,貪婪之島最令我著迷的概念就是,「只要照著遊戲循序漸進,玩家本身就會得到成長」,與我的座右銘「最有趣好玩的RPG,就是自己的人生」相呼應,是理想中的「充滿遊戲的現實世界」。
動物之森 這款就比較正常一點了,是由日本任天堂製作,我把它定義為治癒型輕鬆生活遊戲。
這是個…

Web Components

圖片
今天想要跟大家聊聊 Web Components 這個新玩具,說是新玩具,其實這個概念已經發展有段時間了,尤其筆者本身是玩 Flash 技術出身的,發現 Web Components 跟 Flex Component 差不多,所以就來分享一些心得。
Web Components 是什麼? 簡單來講就是你可以客制化 HTML <tag>。
<my-component></my-component> 由 W3C 提出:
The component model for the Web.
When used in combination, Web Components enable Web application authors to define widgets with a level of visual richness and interactivity not possible with CSS alone, and ease of composition and reuse not possible with script libraries today. 使用 Web Components 有什麼好處? 鉴于许多Web框架通过暴露JavaScript API来构建用户界面,而构建用户界面实际上就是生成一堆div和spans标记,Web 组件是原生浏览器的解决方案因此不依赖于一个完整的框架。因此,与现在的一般依赖某个Javscript框架的HTML组件相比,Web组件希望能减少碎片。 最近新起許多 MDV (Model-driven-view) 這類 template 和 data binding 開發方式的框架 (backbone, angular, ember..), 那 Web Components 跟這些框架有什麼不同呢?
基本上就是希望藉由規格標準化,讓 Web application 的開發方式與架構更清晰。
Web Components 的瀏覽器支援情況? 尽管Web组件是一项有趣的新技术,但在浏览器们都支持它们(并且大部分用户都开始使用这些浏览器们)之前,其中的大部分功能还派不上用场。解决这个问题的一种方法是使用polyfills。 很遺憾,目前的瀏覽器普遍都還不支援完整的 Web Components, …

從無到有: 安裝 & 自動部署 Ruby on Rails 網站.

這個月把網站從 Amazon EC2 搬回自己的 server, 目前整個環境是 Linux(Ubuntu) + Apache + Ruby on Rails 在跑, 筆記一下從無到有的配置方法:
Install VirtualBox 虛擬主機, 另一個較有名的是 VMWare, 這裡是選用 VirtualBox 4.2.12 作 host.
安裝之後設定一下配置, 大部份都用預設的就可以, 比較不一樣的地方有, 記憶體 1024 MB, 網路使用橋接界面卡的方式, 這樣可以在虛擬 OS 內連線取得固定 IP, 這對使用自有網址來架設網站是很重要的.
Install Ubuntu 下載 Ubuntu 最新版本, 這裡使用 13.04, 然後將映像擋掛載在 VirtualBox 後啟動, 照指示一步一步安裝.
安裝完成後, 記得先把系統更新裝一裝, 之後執行:
$ sudo apt-get update$ sudo apt-get upgrade Install SSH 安裝完 ubuntu 後, 為了之後能遠端操作 server, 所以接著安裝 SSH:
$ sudo apt-get install openssh-server$ ssh-keygen -t rsa$ scp .ssh/id_rsa.pub SERVER_HOST_NAME:~/.ssh/$ cat .ssh/id_rsa.pub >> .ssh/authorized_keys 註: 第 2-4 步是為了之後登入 server 可以不用打密碼.
註: 第 3 步的 SERVER_HOST_NAME 記得換成自己的網址或 IP.
Install vim 接著是安裝 vim, 為了之後能在 terminal 上直接編輯文字檔案 or code:
$ sudo apt-get remove vim-tiny$ sudo apt-get install vim Install Git 版本控制, 因為之後部署網站都是直接從 GitHub 拉下來, 所以需要安裝 Git:
$ sudo apt-get install -y git-core 如果需要使用到 GitHub SSH 的話請參考這篇: Generating SSH Keys
Install NVM + Node 雖然我的網站還沒使用到 Nod…

How to create Arduino library

圖片
如何寫一個 Ardiono Library ?
假設要寫一個摩斯密碼(telegraph)的 library.
先在 Arduino 目錄底下(預設是/Users/XXX/Documents/Arduino)建立一個 libraries 資料夾.建立一個資料夾取名為 Telegraph.建立 Telegraph.h:#ifndef Telegraph_h #define Telegraph_h class Telegraph { public: Telegraph(); void send_message(const char* message); // 要公開給別人使用的 method. private: ... }; #endif 建立 Telegraph.cpp (舊版使用 WProgram.g, 新版使用 Arduino.h):#if defined(ARDUINO) && ARDUINO >= 100 #include "Arduino.h" #else #include "WProgram.h" #endif #include "Telegraph.h" Telegraph::Telegraph() { ... } void Telegraph::send_message(const char* message) { ... } 到這邊基本上已經寫好一個 library 了, 接下來開啟一個新的 Ardiono 專案來使用:#include <Telegraph.h> Telegraph telegraph(); void setup() {} void loop() { telegraph.send_message("Hello world"); } 更多詳細的範例原始碼可以參考這個 GitHub repository.

Hello Arduino!

圖片
說來慚愧, 去年才知道有 Arduino 這麼好玩的東西, 連國外小朋友都知道它有多火紅! (不過最近好像是某樹莓派比較牛)
好歹以前也是電子相關科系的, 想說入門應該不難, 回老家把塵封已久的高職工具包翻出來, 今年要試作一隻簡單的機器人!! 既然決心已定, 就開始做一些行前準備, 買了幾本書跟一些工具來練習:
Arduino快速上手指南
Prototyping Lab「邊做邊學」Arduino的運用實例
Make
由馥林文化代理出版, 國際中文版的雜誌, 一季一期, 訂閱一年約一千台幣, 裡面的內容很豐富, 強力推薦!
入門工具包 雖然自己有一些零件, 但是要能完成書上的作品還是有缺, 所以買了一個簡單的工具組合, 基本上拍賣網站都能找到, 價格大約都在一千元台幣上下.
猜數字遊戲
這是我的第一個實作, 也是Arduino快速上手指南的第一章, 主要的玩法是先用第一顆按鈕按出你要猜的數字, LED 會以二進位的方式顯示, 決定後再按下另外一顆按鈕, Arduino 會隨機產生一組數字, 如果玩家猜中的話, LED 燈就會閃爍.
這個小電路做完後基本上可以了解:
如何在電腦上寫程式, 並上傳到 Arduino 運作.基本的電路零件知識, ex: LED, push button..如何利用 Serial 來 debug.如何利用 Serial 來傳送和接收資料.如何使用網路上別人寫好的 Library. 碰到的問題一開始電腦一直抓不到板子, 後來發現我的USB線是充電專用的 囧.. 推薦工具Fritzing - 畫電路圖的工具.

Source code 跟之後的專案都會放在 GitHub 上, 歡迎有興趣的人一起交流 :-)

getDefinitionByName with swc

一般 Flash 程式開發時, 取資源的方式有兩種:
.swf.swc .swf 擋屬於 Runtime 時從外部載進來取用的方式, 通常會使用 Loader 來作處理.

.swc 擋則是 Compiler 時就會一起包進來, 要取用內部元件通常就直接 new 出來就可以:
var component:CLASS_NAME = new CLASS_NAME();
如果想要動態取得元件的話會碰到一些問題, 一般來講會用 getDefinitionByName(CLASS_NAME:String) 這個 method:

不過編譯完執行後會碰到錯誤, 解決方式如下:
Project > Properties

Flex Compiler > 加入下面參數
-include-libraries=YOUR_ABSOLUTE_SWC_PATH.swc

Sublime Text 2 Shortcuts (Mac OSX)

我的數位生活 2012

這次不談程式的東西, 來聊一些 2012 年的數位生活心得, 這幾年許多應用快速雲端化加上智慧型裝置普及率提高, 幾乎大部份的工作都可以離開 PC 來完成了, 剛好在去年我達成了 Apple 家族四天王(iPhone iPad AppleTV Macbook)制霸! 所以在這邊整理分享 2012 年用了哪些服務.
因為我手上的裝置都是蘋果, 所以下面介紹的服務會以 iOS 系列為主, Android 的朋友抱歉囉..
我在找想用的服務時會盡量挑以下幾點符合的:
多螢一雲 有提供各平台的 app, 網頁, 或桌面應用軟體.社群化 擁有自己的社交互動圈, 或整合 twitter, facebook 等服務.手機為主 PC為輔 優先挑選手機 app 好用的服務. 另外, 根據服務性質的不同, 也會看是適合哪個平台來選擇, 例如:
iPhone 人在外面, ex: 工作, 通勤等.., 通常生產力相關的工具會比較適合在這時候使用.iPad 在家裡, 但不是電腦前, ex: 沙發, 床上.., 通常使用閱讀, 影片, 繪畫軟體較適合.Apple TV 在客廳, 不過軟體不多, 通常都拿來看影劇和聽音樂居多.PC 電腦或筆電, 通常都是拿來做較複雜的事情, ex: 整理, 規劃, 編輯.. OK, 在了解完我挑選應用服務的方式後, 下面列出的就是我要分享的清單:
知識管理Google ReaderReederZitePocketEvernoteDeliciousBlogger生產力管理GmailGoogle CalendarRemindersNotesDropbox人脈管理Google ContactsFacebook (Twitter, Google+, LinkedIn)LINE財務管理随手记休閒娛樂iTunes MatchLast.fmTuneIn RadioSoundHoundYouTubePodcastiTunes UGoogle MapFoursquareFoodspottingPicasaInstagramVineAnobiiiBookNewsstand 知識管理 資訊爆炸的時代, 每天有非常多的新訊息從四處而來, 不應該漫無目的的吞嚥, 需要過濾有用的資訊來吸收.
Google Readerweb 我一天最主要的新聞來源不是報紙或入口網站, 而是 Google Re…

Flash Builder 4.7 iOS Debug

Flash Builder 4.7 iOS Debug 這個月剛好玩到 flash on iOS,在部署到 iPad 時碰到些問題,筆記一下最後解決的步驟。
Flash Builder 4.7 提供三種方式部署和測試你的程式:
On AIR SimulatorOn iOS SimulatorOn device 開發環境:
Mac OSX 10.8.2XCode 4.5.2Flash Builder 4.7 PremiumAdobe AIR SDK 3.5 STEP:
先開啟 Xcode 確定有更新到最新版,否則模擬器會有問題。到美國Adobe官網下載安裝 Flash Builder 4.7,可試用兩個月。前往 /Applications/Flash Builder 4.7/sdk/ 底下。複製一份 4.6.0 的資料夾命名為 4.6.0_AIR35。下載最新 AIR SDK 到剛建立的資料夾。開啟 Terminalcd /Applications/Flash Builder 4.7/sdk/4.6.0_AIR35/sudo tar -jxvf <下載的AIR SDK>準備好 Apple Developer 的 .p12 和 .mobileprovision。Debug your app!! 最後發現 Adobe 還提供一個免費又強力的效能檢測工具 Adobe Scout
不過一開始碰到不少問題,Flex 專案沒辦法跟 Scout 連上,最後 Google 到的解決方法:
確定你有安裝 python 的環境。下載 telemetry-utils。開啟 Terminal cd 到 telemetry-utils 資料夾底下。add-opt-in.py <YOUR FLEX bin .swf file>然後再 Run 就可以看到 Scout 的結果了。 缺點是每次重新 Build 的時候就失效了,需要再下一次指令,期待之後會改善。