整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
“HTML5工程師”這個職位也可以說是如日中天，越來越火，市場上也越來越缺乏H5優秀的工程師，下面是H5開發的一款斗牛小游戲，相信很多人都玩過，如果大神看到請賜教，小白看到就跟著小編我一起好好學習吧~
2.兼容性：蘋果設備微信強制使用的是os的瀏覽器safar，頁面訪問的體驗遠大于安卓；安卓情況比較亂套：知乎上有人說是微信6.0.2以上是強制使用的QQ的X5瀏覽器，但是實際情況來看（公司范圍），一部分手機如（魅族，小米，一加，三星，LG等）使用的是X5內核，另一部分如（nexus，國靖的小米）使用的是chrome的內核， 由此來看，安卓上的訪問情況大部分不容樂觀，會不支持某些屬性和出現一些異常。 3.經驗之談：UI給出的設計圖越來越美觀了，但是對于前端的要求就變高了，寫頁面之前，良好的頁面結構設計可以極大地豐富了兼容性和擴展性，這個東西沒有對錯之分，只有好和更好。 4.移動端的動畫：這次我使用的是jquery.animate，出現情況，ios上各個設備均正常，但是安卓方面X5內核的動畫卡頓嚴重。查閱資料，移動端的動畫大部分使用CSS3和zepto.js，盡量不使用jquery的，對于移動端的游戲動畫，流行canvas。 5.touch事件：安卓支持click事件，但是ios不支持，推薦使用touch事件；touch事件基本類型：touchstart,touchmove,touchend, 對于之前需求中的判定向上滑動，向左滑動，向右滑動等推薦使用以下代碼進行處理： //返回角度 function GetSlideAngle(dx, dy) { return Math.atan2(dy, dx) * 180 / Math.PI; } //根據起點和終點返回方向 1：向上，2：向下，3：向左，4：向右,0：未滑動 function GetSlideDirection(startX, startY, endX, endY) { var dy = startY - endY; var dx = endX - startX; var result = 0; //如果滑動距離太短 if (Math.abs(dx) < 2 && Math.abs(dy) < 2) { return result; } var angle = GetSlideAngle(dx, dy); if (angle >= -45 && angle < 45) { result = 4; } else if (angle >= 45 && angle < 135) { result = 1; } else if (angle >= -135 && angle < -45) { result = 2; } else if ((angle >= 135 && angle <= 180) || (angle >= -180 && angle < -135)) { result = 3; } return result; } //滑動處理 var startX, startY; document.addEventListener('touchstart', function (ev) { startX = ev.touches[0].pageX; startY = ev.touches[0].pageY; }, false); document.addEventListener('touchend', function (ev) { var endX, endY; endX = ev.changedTouches[0].pageX; endY = ev.changedTouches[0].pageY; var direction = GetSlideDirection(startX, startY, endX, endY); switch (direction) { case 0: alert("沒滑動"); break; case 1: alert("向上"); break; case 2: alert("向下"); break; case 3: alert("向左"); break; case 4: alert("向右"); break; default: } }, false); 6.禁止滑屏：手指按住頁面進行滑動，頁面的動畫會停止，但是松手之后，動畫已經完成，影響了用戶體驗，在某些情況下（頁面只有一屏），應該禁止手指滑動，代碼： //禁止頁面滾動 function forbidPageScroll(){ var stop=0; document.addEventListener("touchmove",function(e){ if(stop==0){ e.preventDefault(); e.stopPropagation(); } },false); } 7.音頻：audio標簽的自動播放autoplay，iOS不支持，并給出理由“這會導致用戶的流量被偷取” 所以ios設備上禁止了自動播放功能，可以綁定touchmove事件，用戶點擊屏幕任何一處都可以觸發音頻播放。安卓支持自動播放。 8.推薦一個打亂數組順序的簡單的方法： var boss = [1,2,3,4,5,6,7,8]; //打亂順序 boss = boss.sort(function(){ return 0.5 - Math.random() }); | 總結起來就兩點： 1.簡單，隨時隨地能立馬玩兒起來! 2.可以在朋友圈進行分享。 只要這兩點，就能獲得大量的用戶。 |
ameLook報道 / 12月28日，對國內H5游戲創業者來說是迎來奇跡的一天。
騰訊28日下午通過多個官方微信公眾號正式公布了“小游戲”，同時上線了15款小游戲產品、其中包含多個騰訊自研的棋牌小游戲，這昭示著騰訊微信正式擁抱H5手游市場，給多年來一直等待H5游戲機遇的游戲開發者送上了終極新年大禮包。而28號全天，已有過萬的國內游戲開發者通過Gamelook的報道了解到這則令全行業振奮的信息。
目前，更新iOS微信6.6.1最新版的用戶啟動微信已能看到小游戲的開屏登陸頁面（android版在灰度測試中），伴隨微信小游戲公布，騰訊還提供給了小游戲開發者新的開發工具、開發文檔。同時28日下午Cocos、Layabox、白鷺這三個國內主流引擎商都發布了引擎的最新進度，全力支持微信小游戲開發者。
對于真正在游戲圈有些年頭的從業者，看到微信小游戲的正式登場，真可謂感慨萬千，在這里gamelook首先要向一直堅守在H5這個陣地多年的開發者、創業表示致敬，真的太不容易了。
微信小游戲：一場遲到5年的機遇，H5創業者歷經千辛萬苦
gamelook最早開始報道HTML5手游趨勢是在2011年，而更早的關于HTML5移動平臺應用的爭議則要追溯到2010年。現在回憶起過往H5游戲領域發生的大事件真可謂歷歷在目，也真叫創業者痛徹心扉。
2010年4月，當時還健在的蘋果公司創始人喬布斯曾發表了一篇文章，重點闡述為何蘋果設備不再支持Flash，喬布斯當時說道：“讓第三方（Flash）插足平臺和開發者之間，最終會制造出低標準應用，它會阻礙平臺的擴張和進展。”
因為蘋果的堅決、google的跟進，Flash在移動端走向了末路，順其自然，全球開發者開始按照蘋果給出的方向：HTML5，勇敢前進。但誰知創業者勇敢追逐的HTML5卻帶來行業長達數年的痛苦。
2011年，騰訊QQ游戲中心在國內設立了總獎金百萬元的“騰訊移動終端游戲開發大賽”，這是騰訊開始介入HTML5游戲領域的標志性事件，在當時的報名信息中，騰訊即積極鼓勵HTML5移動游戲開發者參與這場創業者選秀。而2011年1月騰訊微信剛剛發布。同時在海外市場，2011年Facebook也開動了自己的代號“斯巴達”的H5游戲平臺建設。
有著蘋果、騰訊、Facebook這些超級平臺的趨勢指引，其后，諸多國內創業者開始加入了H5游戲創業浪潮之中，當年移動開發者活動中非常火的一個就是創新工場力挺的“HTML5大會”。
在眾多創業公司中，當年最具有代表性的H5游戲公司叫磊友科技，其創始人黃何曾是騰訊公司產品經理，2010年就早早嗅到了H5的苗頭獲得創新工場投資、之后累計融資超過千萬美元，磊友不僅開發H5跨平臺游戲引擎、還自己開發H5游戲產品，當屬最早的H5明星企業，但誰知磊友也成了H5游戲“概念包袱”最重的創業公司。
雖然2017年年末的微信小游戲引爆行業，但在gamelook記錄中，早在2012年Q2騰訊高管劉熾平就做了相應的表態，劉熾平當時曾表示：“大型應用軟件將基于本地客戶端，其使用量將非常大，需要不斷發展。這些應用軟件應當具有大量內置特色功能供用戶使用；但同時對于很多用戶不是每天都使用的應用程序或者內容，通過瀏覽器或者HTML5訪問可能是更高效的途徑，因此面向這兩種應用程序的市場將繼續存在。我們嘗試要做的是，參與到這兩個市場里。”
劉熾平2012年就指出微信、手機QQ、瀏覽器是HTML5應用的載體，但騰訊所設想的非原生APP的第二個應用市場，直到2017年才開始真正著手嘗試。
5年的間隔，意味著很多，對國內H5游戲創業者來說代表著遭遇一系列的重大挫折。
蘋果雖然力推HTML5但并不希望原生應用采用H5技術，且對非appstore生態的H5應用和游戲采取了徹底的封堵方式。
微信H5游戲？其實磊友早在2013年即嘗試過，缺乏蘋果和微信平臺的支持，迎頭而來的是H5游戲遭遇各種技術問題、產品問題，進而是磊友公司不斷轉型，乃至最終消失于行業，令行業扼腕。
Facebook在海外主導的H5游戲平臺因為多方面原因慘敗，導致海外跟隨Facebook挺進H5游戲市場的一批大公司相繼在手游市場跌倒，這其中典型的就是豪賭H5手游、而錯失早期智能機爆發期的Zynga。
同時，國內H5引擎代表性公司從當年的磊友，變成了Cocos、白鷺、LAYABOX，典型的H5游戲公司也變成了蝴蝶互動、中手游、37互娛這些更晚進入H5市場的游戲公司。當年磊友沒能解決的技術問題，Cocos、白鷺、LAYABOX用數年的扎實積累、打磨，一個一個攻克，甚至HTML5都已不能代表目前小游戲技術本質。而微信、Facebook經過數年的用戶積累，終于迎來了其移動生態能與蘋果正面磋商的地步。
5年堅守，是所有參與H5市場每一家公司的執念，最終換來了微信小游戲的正式公布。
迎頭而來的微信小游戲到底是什么？
好日子已在眼前，事實上，微信小游戲的公布是整個H5游戲市場最大的爆點，但并不是全行業H5游戲的起點，我們不應忽視手Q、厘米游戲平臺，玩吧，乃至行業內眾多發行商在H5游戲市場上的眾多嘗試。
但仔細去思考微信小游戲代表著什么？真的是大多數人所認為的用戶紅利么？gamelook并不這么認為。
用戶紅利其實對目前的國內互聯網來說已叫消耗殆盡，智能機增幅為個位數，其實幾乎所有的用戶已在移動平臺之上。
微信小游戲的加入，更多意味著流量的再分配、用戶時間的再分配和特定需求的滿足，對騰訊來說手中則是多了一張洗牌整個流量大盤的手段和王牌。
騰訊目前并沒有徹底壟斷分發，難點有兩個，其一是手機終端廠商各占山頭，其二是非騰訊的超級APP對分發市場的競爭。微信小游戲、以及手Q、瀏覽器小游戲的加入，代表著騰訊有了良好的基礎參與到流量的再分配中，但這種分配是基于各種新的用戶應用場景。而當下移動互聯網，流量的發源地主要是基于內容平臺、和社交平臺。
而隨著騰訊微信小游戲的發布，即使是出于防守目的、相信非騰訊的超級APP、手機硬件廠商也將加速推進H5游戲平臺布局。最終全行業平臺對H5游戲平臺基礎設施的快速成型，將產生鏈式反應，催生真正適應于H5游戲分發、應用場景的新生態。
對大家最關心的微信小游戲來說，新的應用場景就是社交化游戲場景、以及新的小游戲分發場景。如果開發者指望騰訊獨代的方式來給小游戲導流，可能有些想當然，以今天微信小游戲上線第一天即發布15款游戲來說，可能后繼微信小游戲的數量會非常龐大，創業者需要認真思考的問題是微信小游戲與原生游戲到底差別在哪里，應用場景到底有何不同才是取勝的關鍵。
事實上，在微信公布小游戲之前，行業內就有兩個非常鮮活的成功案例啟發過行業微信小游戲該如何做，其一就是這兩年大火的房卡棋牌，其二就是騰訊自己的《王者榮耀》。
所以雖然微信小游戲給行業帶來了重大的利好，但不應夸大小游戲導流的作用，行業更應該去思考小游戲產品如何適應這種新的社交化生態環境。
在微信朋友圈的流量簡直就是一個超級大的金礦，不少商家也是投入其中，很多h5游戲也是被商家所利用，成為一種宣傳工具，開發一個h5游戲有很多種方法，而且每一種方法所用到的技術都不太相同，下面藍橙互動小編為大家總結一下，怎樣才能做好一個微信H5游戲，首先得知道這些微信h5游戲都具有哪些功能和特點！
功能
1.跨平臺：開發微信h5游戲其中一個最大的優勢是游戲在大部分的設備上都可以運行。是的，如果使用原生語言來開發，你必須考慮你的游戲需要怎樣適配所有尺寸的屏幕。另外你還必須針對不同的平臺去調整代碼，而且在每次遷移平臺的時候都需要調整代碼。所以當你需要開發一個微信游戲之前首先要考慮移動設備的兼容問題。
2.分享性：很多讀者可能會覺得做本地手機安裝的游戲不是性能更好嗎，但是用戶往往會忽略了微信h5游戲的推廣價值。不要低估了推廣微信h5游戲所能帶來的效益，借助微信的分享和轉發功能玩家可以輕易地將游戲鏈接通過好友或者朋友圈分享給其他用戶，而且微信游戲可能更加靈活地調整內部鏈接，可以引導用戶通過游戲引流到不同的地方，可以將用戶的轉化率提到最高。
特點
1. 速時 游戲要 1 分鐘甚至是 30 秒內可以玩完，神經貓，瘋狂手指，數鈔票，房祖名無不屬于這類。瘋狂手指甚至短到了 10 秒，如果你在網上搜，可以搜到 10 秒 600 次的視頻。
2.簡單 到迄今為止能火的都是快餐類游戲，特別為開發人員所不屑。但現在輕游戲幾百款傳播量最大的都是不需什么智商的游戲，這是現實。這點很多人也都意識到了，不多說。
3. 競技 這部分體現在分數，例如傳播文案，xx 分，超過宇宙 xx% 人之類的。還有本地存儲分數等，稍復雜一點可以加入排行榜，這點加分項，不是必要條件。
4. 抓熱點/拼創意 瘋狂手指創意來自于一個工程師，另一工程師開發 1 個小時上線，第二天就快千萬流量，創意爆款可遇不可求。房祖名，冰桶則是抓熱點事件，通過瘋狂手指，黑白格，找你妹等游戲變化得出，對實事熱點的包裝是更靠譜的一條路，我們后來的原創打老虎也是類似思路。這是運營、市場所擅長的事，或者頭腦風暴也不是不可以。這點的要素是——及時。不及時無價值。
5、病毒式傳播 最早的《神經貓》、《看你有多色》等實現朋友圈“病毒式傳播”的H5游戲，都實現了超過千萬IP的訪問，雖然微信基于用戶體驗的考慮，主動限制H5游戲傳播。但事實上，標準目前很模糊，只知道游戲訪問量大的時候會被注意到。而且微信還未提供H5頁面游戲的統一入口，未來不排除微信提供統一的后臺操作。
從上述所說的微信h5游戲特點可以看出，微信h5游戲因為其非常簡單容易上手，并且不用花費人們太多的時間就能很好的在朋友圈完成互動被廣為流傳。所以基于以上條件，基本可以判斷怎樣才能做好一個微信
H5游戲。藍橙互動專業從事微信游戲開發、微信公眾平臺搭建，歡迎有需要的朋友與我們聯系。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
