beryujp

ウェブデザイナーを志していたはずがWEB系開発者になってしまった、京都出身1986年生まれ。
趣味でPhotoshopとかも。
会社で音楽を聞きながら仕事する人のためのiPhoneアプリ作りました。 http://blk.jp/ThirdEar/

Works

iPodのクリックホイールを再現

指でぐりぐり回してスクロールするクリックホイールの動きを再現してみました。 iPhone4Sで動作確認済。

  • 3739
  • 14

ブリーフィングフォーム forked: 第二回全国統一 HTML5実技コンテスト エントリー用コード

サインアップフォームを、コンシューマーゲームで見かけるブリーフィング画面をイメージして仕上げました。 「**漢(おとこ)がときめくUX**」がテーマですw ## 操作方法 * クリック操作とキーボード操作に対応しています。 * キーボードの場合はEnterキー押下で次のシーンに進みます。 (性別選択画面だけは「←」「→」のどちらかのキーを押してください) ## 動作確認済 * 最新版のGoogle Chrome (ver.23) ## HTML5ロゴのライセンス情報 The HTML5 Logo is licensed under Creative Commons Attribution 3.0 Unported by the W3C.

  • 3110
  • 12

ジャケ写を眺めながら音楽試聴 forked: SAKURA

【注意】音が鳴る作品です。 上から落ちてくるジャケット写真を眺めながら、音楽チャートを聞く作品です。 画像、音源、チャートの取得にはiTunes Store RSSを利用するなど、音楽試聴サイト「30sec.fm」( http://30sec.fm )の制作で学んだ技術を流用しました。 また、ジャケ写の回転アニメーションはJavaScriptを利用すると動作が重くなりそうだったので、CSS3のアニメーションを利用しています。 ※桜のグラフィックは全然使ってないけど、動きは桜が舞う様子をイメージして作ったし…いいよね?w

  • 3592
  • 10

体力制じゃんけん forked: 第一回全国統一 HTML実技コンテスト エントリー用コード

体力の概念を足して、じゃんけんをよりバトルっぽくしてみました。 ## 操作方法 タップ/クリック操作の他、PCの場合はキーボードでも操作できます。 * f キー:ゲーム開始、再戦 * a キー:グーを選択 * s キー:チョキを選択 * d キー:パーを選択 ## ルール * 早く選択するほど相手へのダメージが大きくなります。 * 5回失敗するとゲームオーバーです。 * 序盤は敵の手を見てからボタンを押してもクリアできるスピードですが、途中から勘で選んでいかないと勝てなくなりますw ## 動作確認済 iPhone4S、最新版のGoogle Chrome

  • 14567
  • 10

背景画像で使い方それぞれなToDo forked: Simple ToDo管理アプリ with HTML5

【使い方】 * 画面をクリックすると、その場所にToDoが作成されます。 * ToDoをクリックで編集、ドラッグで移動。 * デスクトップから画面上に画像ファイルをドラッグ&ドロップすると、背景がその画像に切り替わります。 (一度設定した画像は、次回以降に開いた時も有効です。) * [reset image]ボタンで初期画像に戻ります。 背景をカレンダー画像にしたり、シンプルなグラデーションにしたり。 人によって使いやすい背景画像に変更できるようにしてみました。 Google Chromeで動作します。

  • 4248
  • 12

インベーダーじゃんけん forked: 第一回全国統一 HTML5実技コンテスト エントリー用コード

迫り来るグー・チョキ・パーがDEAD LINEに来る前に撃退せよ!なゲームです。 ##操作方法 (画面右上の「Smart Phone」ボタンで開いたウィンドウでしかキー入力を受け付けないみたいです。) * f キー:ゲーム開始 * a キー:グーを出す * s キー:チョキを出す * d キー:パーを出す * j キー または ← キー:左に移動 * k キー または → キー:右に移動 ## ルール * じゃんけんで勝つとその敵が消えます。 * あいこ・負けだと敵が消えず、弾が跳ね返されます。 * 「DEAD LINE」の赤い領域に敵が侵入するとゲームオーバーです。 ## 動作確認 最新版のGoogle Chrome(v.22)で確認済。 ## 開発後記 jsdo.itさんがホスティングしてくださっている arctic.js ライブラリを使うとうまく動かなかったので、自分でgit cloneしてきた arctic.min.js をコピペして利用しています。( arctic.js にもCDNあるんかな…?) ※2012/11/14追記:Arctic.jsのCopyright書き忘れてたので追記しました。

  • 8771
  • 1

Skills

  • Photoshop
  • Flash
  • iOS Browser
  • Android Browser
  • jQuery
  • jQuery mobile
  • HTML5
  • XHTML
  • CSS
  • CSS3
  • JavaScript
  • SCSS
  • ActionScript
  • PHP
  • Objective-C
  • Java
  • SQL
  • Shell Script

Awards

Hot tags

Categories

HTML / CSS / JavaScript