2013年 5月 の投稿一覧

メモ:第39回 HTML5とか勉強会+日本Androidの会 2013年5月定例会 #html5j

こんにちはHTML5とかAndroidの勉強会に参加して来ましたりっくんです。とりあえずアップしますけどこれメモをほとんどそのままアップしてるので誤字脱字がひどいと思います・・・。それでも読む人はどうぞ・・・!


飲食禁止!!
初の2つのコミュニティによる合同イベント

DSC_0169

「最近のHTML5はどうなっているのか」

最近坊主にした。Google I/Oで禿げたイケメンを見て目指す。

HTML5

マルチプラットフォーム
マルチデバイス
技術的な成熟

技術的な成熟
「7つの◯◯Web」

オフライン(電波がなくてもOK、[アプリケーションキャッシュ、Web Storage、Indexed Database API、File API]
リアルタイム(Web Socket、GoogleSplish Sheet、Twitter、Facebook[Web Socket, Server-sent Event(Commet), Web RTC]
レスポンシブ([CSSメディアクエリ レスポンシブイメージ、グリッドレイアウト]
セマンティック(何かしらの意図を持ってマークアップする、その意味を込めることができる。
するとそれをプログラムから取得できて、Webが大きなDBになる。[html5 Semantic Elements, Html5 Microdata, RDF/RDFa/RDFa Lite, Microformats]
スピーディ(SPDY、TCPIPのReconnectをなんとかする。[SPDY, HTTP/2.0, オフライン技術]
プラットフォーム(TIZEN,Chrome OS とくにモバイルプラットフォームのWeb、Webがプラットフォームとして浸透している
インプレッシブ(白石作 感動的な)(3dのグラフィックスやシンセサイザーを作るだとか、そういう今までできなかったすごいもの。すごい、もの。ROME([Web GL, HTML5 Canvas, SVG, Web Audio API

Webアプリ VSネイティブ

どちらも一長一短である。

「AndroidとChromeの統合について」丸山

Webアプリの変化(Rich Cliant

Webアプリといえばサーバーレンダリングを送り出すというもの。これが変わろうとしている。
サーバーサイドのWebアプリとAndroidはあまり連携されない、つまりAndroidはまだ単体で動く系アプリである。AndroidのブラウザのHtml5対応遅れが存在した。

今はサーバーサイドのWebアプリのスタイル見直しが行われているHTTP/2.0とかSPDYなど。かなりWWWが臨界点に近づいている。
もう一つ、クライアントの性能がかなり向上してきている。

WebアプリはサーバーサイドのWebアプリと、クライアントサイドのWebアプリに分岐してきたと言える。

Packaged Web Appとは
基本的にはWebアプリ。
・ネットワーク接続を必要としない
・Cloud enabled by default
・デバイスのハードウェア、OSリソース変おアクセス。
・Packagedの形でアプリ配布が可能
・新しい、Contents Security Plicyを採用する。
この背景にあるのは、サーバーとクライアントの役割を見直し仕様。Rich Clientなどなど。

◯Rich Client
クライアント側がリッチになった。
サーバーの負荷増大
ネットワークトラフィック増大
プログラムとViewの分離の難しさ
 すべてがサーバー側でコントロールされていて難しい
 プログラマはデザインの変更を嫌い、デザイナーはプログラムの変更を嫌う
8CoreAndroid時代の始まり(Rich Client ,GalaxyS4

◯Thin Server Architectrue
Webアプリケーションフレームワークの慢心と複雑さに対する反応
プレゼンテーション層をクライアントへ移そうとする。(←これが重要
サーバーはViewを管理しなくて良くなる。
クライアントが分離して開発するので開発が容易に。
→ Rich Client Thin Server Architectureはネイティブアプリまで内包する考え方。

AndroidとChromeの統合

AndroidでのWebアプリ開発の遅れ、ChromeのHTML5の対応が遅い。
Androidのスペックが悪い。Chromeが乗ったことでマシになってきた。
これからはPCとAndroidのバージョンを同じにして同時に提供するようにする。Chromeが動くAndroidは50%
基本的にはiPhoneとAndroidの牙城を崩そうとしている形(第三のOS

統合とは
AndroidのChrome標準ブラウザ化
AndroidへのPackageed Web Appの導入

そのタイミングはAndroid5.0だか、Chrome29とか・・・

AndroidとChromeマーケットの統合もあり得るはず

Chrom Packaged Appの開発スタイル

ブラウザベースではなくランタイムへ。WebViewは使わない。

AndroidとChromeの統合と開発者

飛躍になるだろう
iOSアプリユーザーの3-5倍以上、ユーザーが存在するAndroid。
日本はGooglePlayのアプリ登録数がやばい。2位、米国を抜いた。
知識と技術の偏在のグラフ、表
50$携帯でNext Billionへ。

日本のAndroidアプリ開発者の課題は
Cloud enabled by default

「ハイブリッドアプリの設計」Hidaka Kazuaki

アプリの開発の流れ
端末スペック向上
HTML5の仕様が固まってきた
iOSのUI面での審査が緩くなってきたなど

ハイブリッドアプリのタイプ

ハイブリッドアプリとはHTML5を生かしたアプリ
公式マーケットで配布できる。
複数プラットフォーム対応しやすいメリット
ハイブリッド=技術を組み合わせる

◯タイプ1  WebViewをラッピング
アプリはWebViewを包むだけのもの。
コンテンツはサーバーに置く。
Webアプリをそのまま移植できる。

◯タイプ2 WebViewをラッピング
1とは違いHTMLはアプリに埋め込む
サーバーとはAPI通信を行い連携
ローカルでもある程度動かせる、アプリの実装の代わりにHTML5を使う

◯一部の画面でWebViewを利用する
基本的にはNative
WebViewを利用することでメリットのある画面はWebViewを使う。CyberAgentのやつとかNikkei Bussiness

アプリの設計

大事な方針
とりあえずHTMLではなく、どちらでやったほうが価値がある画面なのか。
価値とは→ 出来上がるものの品質、実装コスト、運用コスト(ここはなにか有りそうだからHTMLつまり汎用性が高いもので)

WebViewが適さないもの
・リストやギャラリー画面
Nativeのリストが持つViewの再利用・画像キャッシュ・開放などのメリットが大きい。
・起動時の画面
表示するコンテンツ以外に付加情報を取得したい画面
データ量を減らしたいし、バージョン見て動かしたいとか。

WebViewが適すもの
・詳細画面などのコンテンツ
・HTMLのレイアウト能力の高さはNativeのそれより高い。回り込み、枠付、リンク挿入など
・特に更新されていくコンテンツの運用では当初の想定外の見せ方が可能

実装例1
WebViewの進む戻る推移と、Nativeの画面偏移の問題が起きやすい。
→ WebViewでのりんく偏移はさせない方針 or 遷移はWebViewで行い、Native部分はダイアログ展開。
実装例2
・長押し処理・フックの処理はjavascriptで行い、Native側に通知
・Call:, Mailto:などのリンクは定番なので対応しておく
・Cookieでログイン状態を連動させる。

忘れがちな違い。
HTMLでの遷移は画面遷移ごとにサーバーから取得する。
NativeならAPI通信で選択できる。

Cookpadはなぜハイブリッドアプリか

もともとWebサービスでコンテンツがサーバーにある。
PC、タブレットと常に同期しているものも多いのでローカルで管理するのは微妙。
更新が多い、リアルタイム性
特定の機能を提供するアプリというより総合アプリという立ち位置。

ローカルで行なっているのは
アプリ関連形容のアカウント情報管理
レシピを載せる機能全般(投稿系
各種ダイアログ
検索時の候補、音声検索、ウィジェット

運用上の理由
細かく仮説・検証が行われているChanko bit.ly/cookpad2012
A/Bテスト、一般ユーザー向けテストをするための環境が整っている。
・スマホサイトとAndroidでコンテンツを共有化

まとめ

ハイブリッドアプリの幅は広い
WebViewのメリット・デメリットを把握しよう
運用は大切
仲間も大切

「ハイブリッドソーシャルアプリの現場」

ポケラボ(6年目のそしゃげ 作る会社

ポケラボとはどんな会社か

社員200名位。
Androidではあまり高い順位をとれていない、そこにハイブリッドの課題があるのではないか。

なぜハイブリッドアプリを採用したのか

ガラケー向けアプリ開発がもともとだったので、Web開発者が多かった。
投資先がWebが最終的にかつんじゃねーの?って言った。

負のログインボーナス

もともとFlashだったのでNativeでのアプリケーションがつくれなかった。
初めはSwiffy(Android動かないものもある)、今はCreateJSを使う。

実際どうなの?

今はiOSもAndroidの両対応が可能。
Nativeは映画を作ってるイメージ。ソーシャルゲームはテレビ局の視聴率を常に高い視聴率を取らないといけない、そういうイメージ。

Flashを使ってCreateJSで書きだす。

WebViewって遅いんじゃないの?
画像とかは一度しかキャッシュしないようにするとか、そういうことをやってる。

◯発生した問題点
アバターをBoneで動かしたい→AS、オブジェクトを無理やり配列に入れてJSにする。
スキルが110、画像データとかJSとかサウンドとかヤバイ。→ require.jsを使うとか。Webの動作が重い。

ポケラボエンジニアがAndroidで目指すこと

ポケラボエンジニア100人
「より早くより快適に動作して楽しんで貰いたい」

ハイブリッド固定メニュー

アプリに重要なヘッダー・フッターの固定メニュー
けどoverflow: scrollとposition:fixedが動かない
→ ネイティブで実装

ハイブリッド高速アニメーション

基本的にCreatJS
多少遅いこともあるので自分で作る。
基本的にハイブリッド(WEBからの指定)
リソースは使いたい
快速アニメーション

→2段階変換
Flash→JS→Nativeと変換させる。独自コマンドをAndroidのCanvasに変換し、描写。
CreateJSの3倍くらいのフレームレート

iOSとのUUID連携

AndroidのUUIDが発行できん。重複しない一意な値。
ただしアプリをアンインストールすると同時に削除されてしまい別UUIDが生成されてしまう。

1端末1IDの為にサーバーを介して管理するようにしている。端末、アプリ、関係なくコラボ連携可能になる。
外ではAndroid、家ではiPadを使って遊べる。

Androidが課題。

「パネルディスカッション」

丸山:今年中にPackaged Web Appsの統合の形を見せる何かしらのAndroid、Chromeに関するものがでそう。

佐々木:TIZENとか、海外ではS3はLowEnd機種的なイメージ。S4はやばい。
でかいWebGLのアプリとかChromeなら結構動くけどスマホだと辛い。S4だとスペック的に結構追いついてきた、2−3年もすると今のChromeで体験できてることがスマホでも体験できるかもしれない。
今の興味はTIZENアプリ

白石:ChromeとHTML5のセッション見てた、多かった。しかしすごい目新しい機能とかはないけども、例えばパフォーマスンスの高速化だとか、
Packaged web app store v2?? Web Components(Polymerというフレームワーク) ネイティブにはあったけどWebになかった、それが出来そう。

WebアプリケーションのプラットフォームとしてAndroidやモバイルデバイスのこれから

丸山:AndroidのHTML5対応が遅すぎた。ChromeがなくてもChromeランタイムがアレばWebアプリが動くような世界を考えている。ネットワークと解する感じではなく、アプリとしてローカルにインストールするようなものがPackaged web apps。まだよくわからない。PWAはデバイス依存をなくそうとしている。

佐々木:HTML5で今のリッチな3Dゲームは作れないけど、そうでないアプリなら作れるような状況。
適材適所で使い分ければどちらでもいいかなぁと。iOSとAndroidで動いてるC++なものを、TIZENに2日で移植できた。
iOSはWebをスクリプトとってきてランタイムエンジンを動かすのを禁止している。しばらくはOpenGLが重要になるのではないか。
Q:今まではWebが遅かったからだめだったけどなの?
A:そうではなく、結局はレスポンスを求めるならNative、そうでないのはWeb。これは適材適所という考え方。
Q:遅いのはグラフィックとロジックにワケられる。ではどのくらい遅いのか?
A:Chromeじゃないとリッチなゲームは作れない、そういうレベルの違い。Chromeと同じ物がAndroidなどで動けばまぁいけるかもしれない。

白石:2,3年くらい前から感じるのは、Webアプリはスマホの機能を使い切れない、けどDeviceAPI群から色々できるようになるのかなぁと思っていた、けどそういう時代の流れではなく、インストール型の(Pakaged we appsとか)ものがこれから増えてきてる。ホステットはあまりできないという状況になってきた。時代の流れ。
今後はインストールできるものではデバイスの機能が使えるようになってくるんだろうなぁと
Q:インストール型と従来とでは違いは?
A:多分ものが違ってくるんじゃないか。カメラが使えないとか。

丸山:PWAはもともとキャッシュを使おうってところから来てる。
W3CとかのものとTIZEN、FirefoxOSとかはもう別々。別のものPWAとしてはものが違う。
デバイスレベルでのSMLは標準化が必要だ。現実的にはまだ世の中に出てないのだからまだ進んでない、なので市場に出て、競争が起きるような状況に、下方レイヤーでは出来たほうがいいだろう。

HTML5のCanvasやSVGに対して、OpenGLやネイティブアプリの動向は

佐々木:WebGLを使う、Canpas使わない理由はCanpas表現を超える表現が欲しくなり、WebGLを使いたくなる。速い、できることも多い。iPhoneではWebGLが動かない。自分でJSコアとかを書いてパッケージングして配信する会社が増えてきている。
でもS4とかは早くてもう十分かもしれない。古い端末をどうするか、結局それはランタイムエンジンを書いたほうがいい。
あとはCoronaとかUnityを使うと結構リッチなものが作れてさくさく動くようになっている。

白石:Canvasについてどう思っているか。一般的なWebサイト作りではそこまでのパフォーマスンスを求められることはあまりない。白石氏的にはCanvasは最終手段。Android2.x時代の悪夢。
Q:チャートとかを作るライブラリだとJSだと遅いCanvas。けどGPUに乗ると100倍速いんだけどそうでないときはめっちゃ遅い。そういう蓄積が必要(GPUに載せる

Canvasリアルタイム書くのが微妙。けどGLSX.JSとか使ってみたらWebGLが速い。今はその体験談からWebGLにフォーカスしてもいいかもしれない。

Webアプリ≒ハイブリッドアプリの進化とは

丸山:エンタープライズとWebアプリはインパクトを与え続けている。エンタープライズは重要
クライアントで処理するなら便利な方を使えばいい。まだ完全にHTML5だけでかけってのは難しいのかもしれない。
しかし最終的にはPackaged web appsみたいな1ソースでいろいろ使えるものにフィックスされるのではないか???????

佐々木:これからはドンドンブラウザが早くなっていく、だからネイティブは要らなくなるかもしれない。C++技術者少ないつらい。

白石:Webアプリにも出来ないことがいっぱいあるって言った。最後に「そこをどうにかしよう」と考えている人がいっぱいる→つまりこれは解決されるのではないか?新野淳一Blog
asm.jsがFirefoxOSとChromeで動かして違いがないとか。なのでWebアプリの未来は明るい。

あまりつよく望んでないAppleがどこまで足を引っ張り続けるのかなぁと

丸山:AndroidがWebプラットフォームが世界で一番大きなプラットフォームだと感じている。

明日からWireless Japan、日本Androidの会でるよーーー。

自分的まとめ

濃い内容の話だった。一介の学生にはとても刺激的になるものでした。
やっぱり開発・運用コストとかの関係でクロスプラットフォームなものに収束せざるを得ないんだろうなと思いつつも、例えばAppleとGoogleみたいなプラットフォームの親玉は”独占”を目指してるはずだと感じてる(もちろん独禁法に引っかからないレベルで、寡占に置き換えてもいい)。でもITの世界ってオープンソースが特に良い例だと思うけど、結構今までの産業とは違って秘匿していく事がすべてじゃない流れができてるから当てはまらないのかもね。

分かる話もあったけど、用語とかでわからないのもちょいちょい出てきてて、メモがミスッてる可能性いっぱいあり。でも現場はこのレベルなんだなぁとしれてすごい良かった。

また興味があるテーマで開催されたら参加しよう!

TwitterBotをNode.jsとntwitter使って運用中、参考記事紹介

どうもなんか今日ちょっと肌寒いですりっくんですこんにちは。パズドラをやってるわけですが、ゲリラダンジョンとか行き始めたらランクが上がりませんぐぬぬ。

Nodejs_logo_light

パズドラ用Bot

俺用Bot作りました。まぁ横流しするだけなんですけど。
ゲリラダンジョンを確認するには@pazubotを見るのが楽なんですが、夜確認するだけだとすぐ忘れて、結局朝も確認して、ついでに直前に確認する・・・にも500もフォロー居ると流速が結構早くて辛い、みたいな事になっててですね・・・。まぁめんどくさくて、Botに監視させて俺にリプライ送ってもらおうと思ったのが今回のBot作成の発端です。

ってことでタイトルにもありますがNode.js使って運用してます。初めはPythonあたりでやるかと思ったんですが、書き慣れたjavascriptを使えるってのが個人的には良いなぁと。あれこれプラグイン探してたら「ntwitter」ってのが有ったのでそれ使ってやってみました。

Node周り

一応Node.jsの環境とか描こうと思うんですが、なんの策略かほとんど僕と同じ構成にしてるBlog記事を発見したので流用しまふ。

node.js node.jsスクリプトをforeverでデーモン化する -でじうぃき – 

forever突っ込んでみたらびっくりするほど簡単にデーモン化できて、起動しっぱなしにできました。今回はBot作成だったので動かしっぱなしどうするかなぁと思ってたんです・・・。
インストールなんかもググってください。一応nvm経由で入れました。

3分でCentOS6にnvmとnode.jsをインストールする方法 – DQNEO起業日記 – 

一応鯖がCentOSな環境だったのでそれに合わせて。とは言えローカルでも動かさないといけないのでMacでも確認したのですが、なんかv0.8.2?とかが入ってたんですよね、それで結局Macでもnvm経由でv0.11.2を入れなおしてます。

Twitter周り

AvianFlu/ntwitter · GitHub – 

コレ使ってます。しかしREADMEにあまり情報がないのでソース読まないといろいろよくわからない。で、なんかぐぐってたら解説してくれてるサイトさんが。ソースリーディング力は付けないといけないっすね・・・。

node.js ntwitter – 

思ったよりも簡単で、しかもStreamingAPIにも対応しているという。

特にこったことはやってないけど、要は@pazubotのツイートを見て、自分の組に該当しているツイートだったら
”@Ricckn ”+その内容
って形でリプライを飛ばすみたいな感じ。一応合計で140字を超えるとエラー吐いてスクリプト自体がストップするのでチェックして、超えたら形成しなおしてはいますが。一応Tweetするようの関数は作っておくと便利だと思います。

var Twitter = require('ntwitter');

var twit = new Twitter({
  consumer_key        : 'consumer_key',
  consumer_secret     : 'consumer_secret',
  access_token_key:   : 'access_token_key',
  access_token_secret : 'access_token_secret'
  });

//Tweetする関数
function tweet(tweetMsg){
  twit.post(
      //"http://api.twitter.com/1/statuses/update.json", APIは1.1になったよ!
      "http://api.twitter.com/1.1/statuses/update.json",
      {status : tweetMsg},function(er, data){console.log(data.text);}
  );
}

※追記
API1.1になったじゃねーかーーーーあああ!!!
ってことで少し書きなおしております。具体的にはURI・・・(‘A`)

サンプルとか参考にしまくってるのでだいたいその辺と一緒です。StreamingAPI周りもかなり簡単にできると思います。適当にSampleStream垂れ流したときはコンソールが大変なことになった。読めねぇ。

しかしこんな簡単に作れるんだなぁと。まぁとか言いつつ、昼まで動いてなかったBotが夕方になっていきなり動き始める怪奇現象が起きてて、んでよくわからんけどそれから先程まで正常に動いているという・・・怖すぎるんですが。

ってことで、簡単なモノ作るくらいならNode.js使うのもありだね!って思いましたし。

貴婦人と一角獣展

ちょいちょいと美術館とかいくようになりましたりっくんですこんにちは。今日は六本木にある国立新美術館でやっている、貴婦人と一角獣展に行って来ました。

貴婦人と一角獣展 | 国立新美術館

20130208103342453

 

なんていうか、説明しにくいんですが、500年も昔のものが残っているってだけで興味深いです。全然しらなかったのですが、6枚のタピスリーが5感となにか一つを表してるみたいです。

千花文様(ミルフルール)が目にも鮮やかな大作のうち5面は、「触覚」「味覚」「嗅覚」「聴覚」「視覚」と人間の五感を表わしていますが、残る1面「我が唯一の望み」が何を意味するかについては、“愛”“知性”“結婚”など諸説あり、いまだ謎に包まれています。

この画像の奴が例の6枚目なわけですが、何を表してるんですかね。

あとやっぱりキリスト教とも結びつきが強いようです。僕はキリスト教とか詳しくないのですけど、解説がまぁあるのでしらんくても楽しめます。

近くで見てもすげーって思うんですが、ちょっと遠くから見るのも面白いです、行く人はそういうのもいいと思いますよっと。

なんだかんだで1時間くらい丸々費やすことになりました、2回は行かないかもしれないですが、もしフランス行く機会があったら深い意味はないかもしれないけどもう一度見てみたいな?w

wpid-wp-1369371883328.jpg

ArminとかSkrillexとか

本日は国立新美術館で一角獣と貴婦人展をみてきましたりっくんですこんにちは、そっちについてはまた別の日記に書きますよっと。

今回の記事は、なんかしらんけどいきなり色々知るようになってしかも好みドンピシャだったので紹介でもしておかないと気が済まない!(あとエントリ数稼げる)っていう気持ちから書いていこうと思います。

Trance Energy - Utrecht, HollandTrance Energy – Utrecht, Holland / ConorLuddy

Armin van Buuren

この間のオランダの王室即位イベントの記事で知ったアーティスト。イベントで流れてる曲はIntenseって曲。

こういうトランスよいっすなー・・・。それにしても国王の即位イベントでDJ呼んでしかもバックに生のオーケストラまで用意して(まぁこれは他の場面でも使えるからだろうけど)がっつりノリノリな会場に新国王入場ってかなりやべぇだろ!!!(笑)

そういうわけで幾つか曲を聞いてみて、どれもノリノリになれるのでローテーション入りです。Intenseってアルバムがこの間出たのかな?でその中に入ってる曲がどれも良いのでクロスフェードデモでも聞いてみてください。

Skrillex

たれかつさんに教えてもらったヤツ。ジャンル的にはDubstepって言うらしい。ベースのごにょにょにょにょーーーーーんって音がやばい。

まぁこんなかんじでトランス系をガッツリ聞いております。他にもいろいろ聞いてるんですけど紹介するのが大変になってきたのでDubstepのまとめ記事を貼っておきます。

【必聴】 テンションの上がるDubstepまとめ 【クラブミュージック】

よいわーーー。

Uploader

GoogleがGoogleTalkをハングアウトとして新しくアプリを公開したようで、とりあえずインスコして使ってみておりますりっくんですこんにちは。Android版の雑感としては、割りと通知バーに更新が来るのめんどくさいって感じです。LINEのあの通知方法、はじめはうぜぇとか思ってましたけど慣れると便利なんですね・・・。まぁそもそもの問題はG+でつながってる人が少なすぎる事なので、移行してくれればやるけどそうでないならつかわないかもなぁというところ。

Uploader

さて本題。
個人的な目的の為に画像アップローダーを作りました。一応完成図したのはこんな感じ。スクリーンショット_2013-05-21_13.38.44その辺にあるのを鯖に入れようと思いもしたんですが、結構自分が欲しいと思ってるものがなかったのと、いい加減一度DBと心を触れ合わせないとなぁと思ってたから作った感じですかね。作りたい欲もあった。

自分が欲しかった機能は

  • 少数ユーザーのみがログインでき、閲覧アップロードができる、誰がアップしたかわかる
  • ドラッグアンドドロップでアップロードすいすい
  • 開いた瞬間とりあえず今相手に見せたい画像が表示されている

なんかうまく言い表せないけどこんな感じ。
状況としては、Twitterにアップするにはちょっと人目につきすぎるとか、Google+はそもそもやってないとかの現状があって、そういう微妙な部分に対応できるアップローダーを作りたかった。俺用のな!現在は一緒にVCやってる人たち用に公開している感じ。

完成してみて

まだバグが残ってたり、UI上の問題(だと思われる部分)が残ってるんだけど、使ってみてかなりしっくりしたものができたと思ってる。そりゃ、自分用に作ったんだから希望通りにならないといけないとは思うんだけどw使ってくれる人(2,3人)からの評価も悪く無いと勝手に思ってる。悪くないよね・・・?w
あ、上のスクリーンショット、僕の画像ばかりなのはダミーを表示してるからですよ????w 他の人の画像は一応許可とらんと非公開にしてる意味がないので・・・! 一応他にもアップする人いるんだよ!

んでまぁ、もうちょっとデザインやることあるかなぁと思ったんだけど、いざ画像を並べてみると結構綺麗に見えてしまって。ヘッダー部分も仮ってレベルでとりあえず作ったものをそのまま流用しちゃってて・・・。でも最低限見られるというかシンプルというか。ちょっと殺風景かもしれないけど。

作ってる時

まず今回はPHPさんにボコボコにされた感じですね。
なんとなく覚えてる範囲で、どんな感じに作ったか(つまづきまくって時間がかかったか)書いていきます。

  1. Twitterでログインできるサービスを作る。
    ドットインストールさんを利用して作ったのですが、ログインに使うPHPのCordbirdがすでに別物になってて躓く。動画見ながらだとできなくてGithub見たらすぐ動くという、あっち見てやるべきだね・・・。
  2. アップしたファイルをログインユーザーのみが公開できるようにする
    ApacheのModを使ってやってる。Apacheの罠に引っかかり(Pathの指定方法)1日丸々使った気がする、アホ
  3. ドラッグアンドドロップでアップロードできるようにする
    いろいろ試してどこかからコードをリスペクト。
  4. 画像をリサイズできるようにする
    なんだっけPHPのWideImageっていうものを使ってリサイズ、クリッピングをかけてる。結構便利。でもコレも使ってみる1日目とちゃんと配置する2日目があった。
  5. 画像管理用のDBを作る
    MySQLってWordpressを入れる時くらいしかつかってなかったからますSQL文を書くのに四苦八苦。あとPDO。
  6. 削除とかそのへんもろもろ
    削除機能をつける、まぁ上のDB周りの応用だったので楽ちん。
  7. デザイン
    並べたらかっこよくなった!!!!!

だいたいこんな感じでしょうか。でも今回はいろいろ助言も頂きましたが、かなりの部分を一人で作れた事にはもう満足感がすごい。

ただし、すげー時間かかっちゃったのでこのへんはなんとかしたいなぁ。いや、次はいける・・・!気がする。

そしてPHPちゃんと結構仲良く慣れた気がします。でもまだJavaScript書いてる時のほうが楽しいのですけど・・・。あんなにPHPで書くとき苦労してたのに、Ajax的な部分を書くのはすんなりなのがぐぬぬと言わざるを得ない。PHP力が足りない。

サーバーサイドは別の言語も使ってみたいなぁ、Pythonとか。そういえばうちのVPSにはPython動かせるようにしてない気がする。なんか次作りたいものができたらPythonも視野に入れようそうしよう。

ってことで8割くらいかんせいして よかった 。

[中止]第5回 [・ω・]狂人じゃないの~村 開村のご連絡 なんてなかった

※すみません、人集まらないので中止で後日やります☆

どうもこんにちは、リアルで人狼をやる機会は有りましたがPHP人狼やってないなーって感じでしたりっくんです。ということで、第5回 [・ω・]狂人じゃないの~村 開村のお知らせとなります。

 

ってことで以下ルールとかもろもろ。

続きを読む

人狼初心者を交えた人狼。

こんにちはARAMばかりやってるせいでサモナーズリフトがどんどん下手になっておりますりっくんですこんにちは。

さて、今日は月曜日にゼミの人たちと8人の人狼を行ったのでその内容とかいろいろ考えて行こうと思います。タイトルにもありますが、4人は完全に初心者でルールも知らないレベルです。残りの4人の内、一人は僕まぁやっと少しできるようになってきたかくらい、あとの三人も1,2回やった程度な感じ。iPhoneアプリを使ってそのアプリ自体がゲームマスターになってくれます。ついでに構成は狼2,占い,霊能,狩人,狂人,村人2が最終的な村です。その前2戦は狂人がいませんでした。つまり3回やったわけです。

とりあえず流れを知るための1戦目

初日は僕は村人でした。言い忘れましたが、身代わりくん設定的なものがあるので初日は人が死にません。身代わりくんに役職もふられないやつです。
そこで3回目くらいな人が占いCOし、対抗なしのまま黒判定を見つけながら終わってしまいました。

占いに対抗がないと信じるしかないです、なのでもし本当の占いがいるなら絶対にここで出た方がいいよとは言ったのですが、真占いだったことと、狼が二人とも運悪く初心者だったのでイマイチなのをしたらいいかわからないようでそのままgg

とりあえずゲームが終わって騙りをするって行為と、残り人数を計算すること、あと霊能者や狩人の役職持ちはどこでカミングアウトすると効果的か考えて見てと、かなりなげっぱなしにして2戦目を始めます。

占い無双2戦目

僕は占いでした。初日の占い結果が黒だったので、その相手の言動を気にしながらの朝だったのですが、その人が「占いいませんか?」って言ってたのを聞いてから占いCO。その人は騙りにくくなったみたいで、相方はあまり経験がない人だったこともあり、三日目の朝にもう一人の黒を占ってgg。やっぱり偽占いが出てくれないとそのままゲームが終わってしまいますね。本当はもっと楽にゲームを終えることができそうだったのですが、「自分はまだ死にたくない」とおう理由でカミングアウトせずにぎりぎりになるという、チームのために死ぬんだ!!

ランダムで負ける

僕は村人だったのですが、またも占いが一人だけでした。このゲームからは追加で狂人が入っていたので流石にやってくれるかなぁと思ったのですけどね!!
完全なるミスがあって一人目の黒がほぼ自分の中では確定していたのですが、まぁミスということと初心者だったのでセオリー通りのグレランをやるようにしました。それが結果的には初日の昼に狩人を吊ることになってて後々辛かったのですが。

結末は狼、狂人、村人、村人から、狼と村人が同票になり、ランダムの結果、狼の勝ちになりました。最後の場面で霊能COとか、狂人なんかやってたらもっと楽に勝てたかもしれないなー。

はずかしがらずに!

人狼は初めてやるとよくわからないゲームかもしれないですが、考えを発言していけばいくほど理解が深まります。その結果、比較的早い段階でつられたり食われたりするかもしれませんが、そのちょっとした発言が味方の考えを刺激していたり、少なくとも何か反論をもらえれば自分にも刺激になります。
騙りはたしかにハードルが高いかもしれませんが、まぁ負けたら負けたで、みすったら潜伏がなんとかしてくれます。ごっちゃごっちゃの人狼もやってみて終わると不思議とおもしろいものですw

ってことでみなさんもっとやっていきましょう。とりあえすゼミ終わりの人狼は定例会な!

ゴールデンウィーク

絶賛風邪っぴきなりっくんですこんにちは。母がインフルエンザB型にかかったところだったので検査しましたがただの風邪でした。こんな純粋な風邪になったの久々かもしらん。

DSC_0108

ゴールデンウィーク

なんだかんだで後半くらいしかGWっぽいことしてなかった気がします。とりあえず日記にします。

シュガー・ラッシュ & YOKOHAMA

某いつものメンバーとDisneyのシュガー・ラッシュを見てついでにビールを飲む会に参加して来ました。

シュガー・ラッシュですが、ゲーム機の中のお話で、悪役は常に悪役で陽の光を浴びることはできません(プログラム的に)。それに嫌気をさした主人公ラルフ君が別ゲームの中にいっちゃってラルフ君が元いたゲームは悪役不在になっちゃってゲームが進まないやばい!みたいな、まぁそんな中のお話。詳しくは映画を見てください。
内容には結構細かいネタが仕込まれていて、絵的にもレガシーで2D的な表現をうまく綺麗な絵に表してるなぁって感心しました。おすすめです!

んで横浜赤レンガ倉庫でやっていたドイツビールのイベント、YOKOHAMA FRÜHLINGSFEST2013

映画を見た後だったので5時過ぎとかに行ったのかな?でもすごい人がいてかなり盛り上がってました。GWってのもあるか。ドイツビールを飲みに行くことが結構ありますが、あのくらい味が有るのもおいしいよね!日本のも嫌いではないですが、日本のビールはガンガンに冷えたものが美味しいイメージがありますね、なんとなく。冷えてないとアレみたいな。

そんなわけで美味しく頂いて来ました。

ウドラ

DSC_0133ウドラです。

知ってますかウドラ。立川市のマスコットキャラクターを決める投票で、2位に入ったキャラクターです。その作者さんがウドラグッズを作ってフリーマーケットで売るとTwitterにて公表していたので、ちょっと買いに行って来ました!

でこの画像が買ったストラップ。このつぶらな瞳・・・、最高。かばんかどこかに付けて布教しよう。あとステッカーも頂きました、ドーン

DSC_0134案の定MacbookAirの画面に。

このキャラクター結構はまってます。
見た瞬間のインパクトが半端無かったからでしょう。残念ながら市のキャラクターにはなれませんでしたが(なってたら今頃立川どうなってんだって話になってそうだ・・・)これからも僕は応援していきます!

これらのグッズについては立川のフロム中武7階のショップにて販売されているとのこと。興味が有る方は下のTweetから辿って買いに行くといいよ!

楽しいゴールデンウィークだったのでは?風邪引いたけどな!