[HTML5]利用canvas裁剪圖片成不規則形狀

這是「繚乱三国演義」中物語進行時的動畫。依照不同的故事情節,會出現不同的武將來陪伴玩家進行物語。
為了減少設計部門輸出的時間,在加上它並不是規則的正方形,在ios版本時我採用的是css的「-webkit-mask-box-image」方式把它遮成六角形的樣子。

但是在即將上線的android版本中,css的遮照會因為套用css動畫而失效。所以就必須考慮其他的方式。本來我是想在動畫結束後再重新套用一次css遮罩或是直接就用setinterval不斷的套用。可惜騙不過所有的android瀏覽器。最後只好想辦法用canvas來重新繪圖。
繼續閱讀

[iphone App]関ヶ原演義リリースしました!

「関ヶ原演義」是一個有關於日本戰國時代的iphone遊戲,也是我在公司主要的工作~終於,今天在apple store跟大家見面了!

不過這個app並不是一個鈀所有東西包在app中的遊戲,玩的時候仍然需要有網路來跟server端做連結。遊戲的底層建立在日本遊戲公司モバゲー的系統上。
我負責的是裡面所有的動畫部分,也就是所以會動的地方。

第一次用html5做動畫其實沒有想像中的難,本來是考慮用canvas來畫,但是canvas在iphone 4以下的機器實在是慢到無與倫比,因此採用的是css3跟簡單的javascript來完成。
不過在app中用webView來做遊戲,很大的缺點就是下載的速度問題,所以如果在網路速度比較慢的地方,就會看到一些奇怪的缺圖的現象….

不過正常情況下應該是會蠻順的啦~呵呵!

感覺現在日本來蠻流行這種微sns的RPG遊戲,玩家用很簡單的方式可以解任務升級,然後收集寶物,結黨對戰…..
有趣嗎?嗯,玩玩看就知道囉~(招待ID請輸入【justfly】,謝謝^^)

[facebook]在APP中導入自己的CSS

關於如何在FACEBOOK中建立自己的APP,已經有很多很多先賢們的資料可以參考了
但是,要在自己的APP中使用自己的CSS卻讓我煩惱了很久
一搬來說我們都是以

<link rel="stylesheet" type="text/css" href="{$domainURL}css/css.css" />

的方式來參照css的路徑
但是,facebook app卻抓不到放在我們自己網域中的css
google了一下才發現,facebook“好像”是會到我們的server中把css抓回去在讓我們的app去參照它
所以,說破了也不值錢,就是用:
繼續閱讀