ラベル Android の投稿を表示しています。 すべての投稿を表示
ラベル Android の投稿を表示しています。 すべての投稿を表示

2018年2月13日火曜日

DroidKaigi 2018のWebサイトとか振り返り

DroidKaigi 2018が終わりました。今年もWebサイト関係やってました。

当日の担当は公式Twitter警備がメインでした。 ちょっと体調が完全じゃなかったので無理せず控室でもくもくとやってようと思ってたんですが、流石にその他諸々な雑用とかもしてましました。

以下、主にWebサイトについての振り返り。

Webサイトについて

去年の7月くらいだったか。サイト班のwm3さんとpsideさんたちとハングアウトで会話して、今年のサイトの方針についていろいろ決めました。

この2人がかなり動いてくれて、更にその他のスタッフもサイト更新を手伝ってくれたお陰で今年はかなり楽でした。 むしろ2人がかなりやってくれて、俺いらなかったんじゃないかレベル。 ありがてぇありがてぇ🙇🏼

droidkaigi.jpへドメインを変更

2017まではGitHub Pagesを使っていて、ドメインもgithub.ioでした。 今年からはdroidkaigi.jpというドメインに変えています。 実のところGitHub Pagesでホスティングしてるのは変わらないんですが、カスタムドメインにすることで将来的に何かしらバックエンドのシステムを持つ場合に差し替えやすいようにする目論見です。

ドメインはCloudflareを使ってSSL対応してます。

サイトジェネレーターとしてGatsbyを採用

GatsbyはReactを使ったサイトジェネレーターです。 2017まではGitHub Pagesの機能を使っていましたが、色々辛かったので全く異なる形に変えました。 流れは大体こんな感じだった。

🍏「Liquid辛いいいい」
pside「nokogiri辛いい」
wm3「もうReactでいいのでは」

Liquid(HTMLテンプレートエンジン)もnokogiri(HTMLパーサー)もGitHub PagesのRubygemが依存してる。

サイトのアーキテクチャ構築もwm3さんがやってくれました。 その後の改修などはもちろん俺もやってましたが、React童貞だったのでおっかなびっくり触ってました。

個人的にはLiquidの仕様上の制約により辛かったタイムテーブルページの実装をなんとかできたのが大きいです。

NetlifyやCircleCIを使ったContinuous Deliveryっぽいの

最終的なホスティング先はGitHub Pagesなんですが、 別途Netlifyも使っていました。

PRを作るとその内容でビルドしたサイトがNetlifyにデプロイされて皆ですぐ確認できる形になります。 Google App Engineみたいに複数のバージョンをデプロイできるので、PR別(ブランチ別)に バージョンをデプロイする感じです。

PRをNetlify上で動作確認してmasterにマージするとdroidkaigi.jpをホストしているGitHub Pages用リポジトリにCircleCIでpushする流れです。

スポンサー一覧

サイト上のスポンサー一覧は、ベースをサイト班で作った後はスポンサー班が直接PR出してどんどんマージしていく運用でした。 途中ちょっとサイズ感の調整のためにデータ構造を変えた以外は、スポンサー班がサイトへのスポンサー様ロゴ掲載をやってくれました。 去年までは俺がIllustratorいじくりまわして頑張ってたなぁ。

Sessionizeとの連携

今回は応募トーク管理にSessionize.comを使用することにしました。 KotlinConfでも使われていて、トークの募集・レビュー・採択・タイムテーブル作成まで行える優れものです。

API経由でjsonデータも取り出せます。 当初Webサイトでは応募トーク一覧や採択トーク一覧を直接このAPIを叩いて書き出していました。 しかし、流石に大量に頻繁にアクセスされることを想定したものではなかったようで、アプリから参照されたりすることも考えるとパフォーマンスに不安がありました。 最終的に、一旦jsonを落としてきてから静的にデータを持っておく形になりました。 データはCircleCIのcron機能で日次で更新していました。

他方、基本的にSessionizeをマスターデータにしたいものの、サイト側やアプリ側の表示制御のために独自に追加したい項目もあったりしました。 そのために、サイト上に置いているjson(タイムテーブルの描画にも使ってる)はビルド時に加工したファイルになっています。

次回のDroidKaigiに向けて

色々改善できたり新たな試みを試した結果、欲や改善点も出てきました。

  • もっとCMS化したいかも
    • 他のスタッフも作業しやすいほうがいいよね
    • 公式Twitterやアプリとの連携も
  • 日英だけじゃなく両方の言語というセッションがあった…
    • これは急遽言語区分を追加して対応した。来年は最初から考慮しよう。
  • スポンサー情報のマスター化
    • アプリ側との連携を考えずにスポンサーページを作ったので、あとから無理やりスクレイピングしてスポンサー情報jsonを作るという辛み溢れる状態になっている。
    • 来年は最初からマスターデータの形を考えておこう。
  • Sessionizeとの連携をもっと楽にやりたい
    • 一旦jsonを持ってくるとかちょっとアレ
    • 間にFastlyか何か挟むとか
    • Fastly使ってみたいだけとも言う

その他

最近裏方業ばっかりなので、今年は登壇とか増やしたいななぁ。

とか思ってたら、まだ動画やスライドの公開作業あったよオイ。

2015年5月30日土曜日

Nexus9にAndroid M Previewを焼く

Android MのDeveloper Previewが公開され、システムイメージも公開されました。
焼く手順は Flashing Instructions に書いてありますが、実際やったら躓いたのでメモ。

環境

  • Mac OS X 10.9.5
  • Android SDKなどはセットアップ済み
  • Nexus9はまだOEMロックしたままだった

手順

  1. Nexus9の開発者オプションで「OEMロック解除」の許可にチェックを入れる。
    ※Androidのバージョンによっては表記が違うかも。
  2. 下記URLからNexus9用のシステムイメージ(volantis-MPZ44Q-preview-d15ad483.tgz)をダウンロードし、解凍する。
    http://developer.android.com/preview/download.html#images
  3. Nexus9をUSB接続する(ADB接続できるようにしておく)。
    adb devicesとか叩いてADBが繋がること。
  4. adb reboot bootloaderを実行する。
    Nexus9にHBOOT(Nexus9のブートローダー)の画面が表示される。
  5. fastboot oem unlockを実行する。
  6. Nexus9の画面が切り替わり、OEMアンロックするかどうか確認される。
    Volume UpキーでYesを選択する。
    データがクリアされた後、ブートローダーの画面が表示される。
  7. ダウンロードしたシステムイメージに同梱されてるflash-all.shを実行する。
  8. なんかエラー出た。
    target reported max download size of 518205818 bytes
    archive does not contain 'boot.sig'
    archive does not contain 'recovery.sig'
    fastboot(13207,0xa14a01a8) malloc: *** mach_vm_map(size=2132963328) failed (error code=3)
    *** error: can't allocate region
    *** set a breakpoint in malloc_error_break to debug
    failed to allocate 2130828644 bytes
    error: update package missing system.img
    image-volantis-MPZ44Q.zipの中身の焼きこみに失敗してるらしい。
  9. image-volantis-MPZ44Q.zipを解凍して、中身の各imgファイルを書き込むコマンドを実行する。
    下記をすべて実行する。
    fastboot flash boot boot.img
    fastboot flash recovery recovery.img
    fastboot flash system system.img
    fastboot flash cache cache.img
    fastboot flash vendor vendor.img
  10. 終わったらリブートする(ブートローダー画面でREBOOTを選択)。
    Android M Previewが起動する。
    ※必要ならOEMロックする。ロックするときもデータはクリアされる。

参考

2015年5月29日金曜日

Google I/O 2015 Keynote

Google I/O 2015 Extended Tokyoで観たKeynoteのメモ

  • date : 2015-05-29
  • place : 六本木TOHOシネマズ

Keynote

全周囲スクリーンでピンポンやってた

Android M Developer Preview

  • 品質改善を目指す
  • バグ修正
  • プラットフォームの抜本的な要素の見直し

カスタマイズ重点

  • App Permissions
    • AppOpsがちゃんとリリース
    • 機能の使用時にユーザーが許可/不許可を選べる
      • もちろん、本体設定で後で(または先に)変更できる
    • 8つのパーミッション?
  • Web Experience
    • Chrome Custom Tabs
    • タブをプリフェッチ?
  • App Links
    • Intent起動を賢く出来る?
    • ユーザの選択を奪うだけに見えた
  • Mobile Payment
    • Android Pay
    • 決済サービス
    • 実店舗でもアプリ内でも
  • 指紋認証(Fingerprint Support)
    • Password Credentialとして使える
    • デバイスアンロックとか
    • Play Storeで購入時の認証にも
  • Power & Charging
    • Doze というプロジェクト?
    • Nexus6にM乗せたら、2倍電池が持つようになったよ!
    • USB type-Cで高速な充電
    • Android端末自体をモバイルチャージャーにできたり
  • 細かい所の使い勝手改善
    • コピペのUIとか
    • 音量設定UI
      シークバーの所に着信音・メディア音量・アラームの3つのシークバーが並ぶ。
  • その他いろんなfeatures
    • 「最も洗練されたバージョンです」
      ↑いつも言ってない?

Android Wear

  • 機種が増えてるよ!
  • ウォッチフェイス大事!
  • always on
    常にウォッチフェイスを表示できるようになった
    白黒のLow-powerモード
  • 手首をひねる動作で操作できる
  • 手書きでEmojiを入力できる(手書きしたものを認識して対応する絵文字を探す)

Brillo

  • Internet of Thingsのためのもの
  • Androidからの派生
  • IoT的な機能を最小限のfootprintで実現できるように
  • Weaveというスキーマ?
    JSON
    クラウド,電話,Brilloデバイスを繋ぐAPI

BrilloのDeveloper Previewは第3四半期
Weaveのは第4四半期を予定

検索の改善

  • 画像認識の進化
    ニューラルネットワークによるDeepラーニング
  • コンテキストを含めた検索

Google Now

  • 3つの柱
    • Context
    • Answers
    • Actions

Now on Tap

  • Android Mの新機能
  • より深くコンテキストを理解して検索する
  • しかも音声認識で自然言語検索
  • アプリ側の変更は不要
  • デモ
    • 音楽を再生中に「彼の本名は?」と音声認識で聞くと、そのアーティストの本名が出てくる
    • 「○○という映画を見に行こう」というメールで使えば、映画の情報を出してくれる
    • レストランで読み方がわからないメニューがあった時、画像検索してみる
      適当にそれっぽく読んでも、メニューを見ているというコンテキストを理解して検索してくれる.

Google Photos

  • (アイコンは見覚えあるけど) 新しいサービス
  • 写真・ビデオをうまいこと整理・管理してくれるサービス
  • 人・モノ・場所によって自動で分類
  • 写真の内容を画像解析済みなので「トロントの大雪」で検索すれば、 ちゃんとその時の写真が出てくる。
  • 複数選択の賢いUI
    1つ長押しして選択状態に -> そのままドラッグして範囲選択!
  • 一覧で年月日の細かさをピンチイン/アウトで切り替わり
  • 相手がアカウントを持っているかとかログイン済みかとか気にしないで共有できる
  • 無制限・無償なバックアップストレージ
    どんな高解像度・巨大なファイルサイズでもよい
    今日からすぐ使える!
    (※なにそれこわい)

次の10億人へ向けて

 いろんな取り組みの紹介

  • Google Translatesのビデオ
  • 次の2年で12億のスマートフォンが増える
  • Android oneデバイスが新興国でどんどん増えてる
  • Chromebookも普及してきてる
  • しかしネットワークはまだ遅い。なので最適化をしている。
  • ChromeのOffline Support
  • Google MapのOffline Maps対応を目指している
    オフラインでも周辺の施設を検索したり
    そのまま音声案内ナビゲーションを開始したり

開発者へ

Develop

  • Android Studio 1.3
    • C/C++ サポート
    • Gradle早くなる?
  • Polymer 1.0
    • Polymer Elements
  • Cocoapods
  • Cloud Test Lab
    • apkをアップロードすると、世界のトップ20の機種でのテストをしてくれる!
  • Firebase

Engage

  • App Indexing
    • めっちゃAppLinkがある
    • iOSでも実験中
  • Cloud Messaging
    • iOSサポート
    • Android, iOS, Chrome の3つのプラットフォームで
  • Chrome
    • Push Notification
    • Add to Home screen
  • App Install Ads
    • iOSサポート
  • Google Play
    • デベコンでもっといろんな情報を見れるように
    • Analytics
    • Play Store Listing Experiments
    • Developer Pages
      • 開発者が自分の他のアプリを紹介したり出来るページをPlay上で
  • AdMob
    • Analyticsしてるよ
    • メディエーション増えてる。直近だと中国のTencent

Google Play上でのアプリの検索

  • 10億人ものユーザがいる
  • どうやってアプリにリーチさせるか
  • 検索結果のカテゴライズ
    • 例えば「ショッピング」で検索すると、 検索結果はファッションやクーポンなどといったカテゴリに分かれている
  • Family Star
    • 家族向けコンテンツ

Cardboard

  • Google Play上にいろんなアプリがすでにある
  • CardboardのSDK改善
  • 改善した新しいCardboardを配るよ!
    磁石スイッチとか

Expeditions

  • Cardboard遠足
  • 複数のCardboardに同じコンテンツを表示させる
  • 世界のいろんな場所をCardboardで観られる
    万里の長城でもベルサイユ宮殿でも

Jump

  • Cardboardコンテンツを作るためのもの?
  • 360度撮影とコンテンツ作成までのフレームワーク的な?
  • Camera Geometory, Assembler, Player
  • Camera Geometory: 360度を16台のカメラで撮影
  • Assemblerでそれをゴニョる
    • 撮影した写真から奥行きや、モノの配置などを認識する。
      元はただの写真だが、各カメラの撮影した部分の被った部分で頑張るみたい
  • Player: YouTubeっていうのがあってね

最後

自動運転や、気球による通信基地局提供プロジェクトなど進めてるよ! また来年!

2015年5月27日水曜日

shibuya.apk の雑なメモ

shibya.apk 行ってきました!

※当日の内容は網羅してません。気になったトコだけメモしてたものにちょっと毛を生やした記事です。

日付: 2015-05-22
場所: DeNA

発表1. それwebでよくない?

Webアプリを普通のアプリと同じように動かす仕組みが出来てきている。
なので、Webでよくない?という話。APKじゃねぇ

  • Web App Manifest
    • locationバー非表示にする設定とかできる
    • Chromeで「ホーム画面に追加」したアイコンから起動すると、Overview screen(Recent Apps)でアプリかのように表示される
      ※ Chromeの「タブとアプリの統合」をOFFにしていても、別のアプリのように振る舞う
  • Service Worker
    • WebアプリとNativeアプリとの差を埋めるためのもの
    • オフラインでもキャッシュを返したりとか
    • サービスワーカーでfrontに返すデータをinteruptしたり、キャッシュしたり
  • WebPush
    • Chrome 42からWebでも通知出したりできる
  • Web App Install Banner
    • Web標準仕様ではない
    • Web App Manifestが条件に合致すると、Chromeがホームへの追加をサジェストする

発表2. Meets Jack and Jill

「全部qiitaに書いておいたからメモ取らなくていいよ!」

Android - Meets Jack and Jill - Qiita
http://qiita.com/calciolife/items/faf6affc0f8cf70c4af9

  • 最適化しつつコンパイルするよ!
  • ARTにとって良くなるようにバイトコードを最適化とか

発表3. fabricの話

wasabeefさんに代わり、Flockで来日していた@romainhuetさんが発表することに。

https://get.fabric.io/

  • FlockでiOS向けに話した内容をAndroidに向けに変えて話してくれた
  • fabricは、Twitter社が提供するアプリを作るための色々なサービスを含むブランド?みたいなものらしい
  • ClashlyticsとかMoPubとか
  • Digitsがちょっと気になった
    • SMSによるユーザ認証の仕組みを提供するものっぽい
    • SMSの送信数に制限無く、現状無料で使えるらしい。まじで!?

懇親会

LTしたらTwitterのTシャツ貰えました!(ジャンケン大会で配られたものと同じ)
でも、飯食いそこねました!

アプリの通知をLollipop対応しよう / shibuya.apk 2015-05-22 LT // Speaker Deck
https://speakerdeck.com/mstssk/shibuya-dot-apk-2015-05-22-lt

LTの内容は、C87で甘味アンドロイドパークに書いたのをまとめたもの。
テクブ本のお求めはBOOTHCOMIC ZINで。
関係者を倒してもドロップはしません。

2015年5月11日月曜日

DroidKaigi私書録

去る2015年4月25日、DroidKaigiを開催しました。ご来場頂いた方々ありがとうございました。

私は運営メンバーとして参加し、主にWebサイトの管理・構築をしていました。
勿論、当日はスタッフも!

色々思い出しつつつらつら振り返ってみます。

DroidKaigiのWebサイト

りんご、Webサイトつくってよ ──── mhidaka

そんな感じでカジュアルに誘われ、ほいほい付いて行ったのが第2回のDroidKaigi事前ミーティングでした。
そのMTGが1月27日。
そこから1週間後の2月3日には、CFPのためWebサイト公開までこじつける事になろうとは、思いもよりませんでした*1

WebサイトはGitHub Pagesを使ってます。 独自ドメインの取得も考えましたが、今回は手弁当でやる方針が決まっていた事もあり droidkaigi.github.io で公開しました。

CFP開始予定まで時間がなかったので、最初はBootstrapでえいやと一人で手っ取り早く作成。 公開前にデザイナーさんにアドバイスを頂いて細かい部分を手直ししたりしました。 公開後も、ところどころの修正を他メンバーからガシガシPR貰って直したり。 なかなかGoogleで検索結果上位に来ず、sitemap.xmlを導入しようとしたら、間違ってサイトが30分ほどすっとんでたのはいい思い出です。

CFPは別にGitHubのissue上で揉まれて作成された文面を載せてます。 CFP担当のメンバーもギリギリなスケジュールの中頑張ってました。

採択したセッションの公開のタイミングで、@yulily100さんにデザインして頂き、 Jekyllを弄ったりなどの技術面を私がやる体制に。 ゆりりーさんは「デザイナーがXMLを書くことでできる改善しやすいアプリ開発」というセッションで登壇もされています。

実は、DroidKaigiアプリ のためにセッション情報を取得するAPIなんてのも作っていました。 Jekyllでjsonを書き出してるだけですけどね。アプリ開発のスケジュール都合上使いませんでしたけど。

Webサイトを作った際の知見については、 「DroidKaigiのWebサイトの作り方」 という記事でまとめています。内容被ってますが、こちらもどうぞ。

アイロンプリントしてました

背中からアイロン台がはえるよ ──── mhidaka

DroidKaigi当日、早朝の渋谷マークシティにアイロン台を背負い現れる、我らがDroidKaigi実行委員会代表の言葉です。

ご来場頂いた皆さんは、運営メンバーが公式Tシャツに「圧倒的当事者意識」とか、何やら色々と貼り付けていたのをご存知だと思います。 私はアレを前日に都内某所で印刷してました。
そしてあの当日、サイバーエージェント社セミナールームの衝立に遮られた向こう側、スタッフの控えブースにはアイロン台が鎮座していたのです。

ちなみに、私は自分のアイコンを背中に貼り付けてました。
個人的には「アンドロイドチョットデキル」を貼り忘れたのが心残りです。

圧倒的当事者意識

上でも触れましたが、DroidKaigiの運営メンバーの中で、何故か圧倒的当事者意識という言葉が流行っていました。 コミュニケーションで主に使っていたSlackでは絵文字にする始末*2

Slackの絵文字を追加するのは簡単です。 設定ページにアクセスして、 絵文字名を ati と入力して、 画像を選択し、 「Save New Emoji」をクリックするだけ。

この言葉は某社の標語から来ていますが、DroidKaigi運営内の使い方はどうやら本家とは違ってたらしいです。
本家某社内では「ATIを見せてくれ」って感じで何かをお願いする際に使うのが主だそうですが*3、 DroidKaigiの運営内では「すごいATIだ」という具合にthumb up的に使われる場合のほうが多かったです。

当日

当日の朝、集合時間が迫る渋谷駅を見事に乗り過ごした所から一日がスタートしました。
当日の担当は基本的に受付係。あとは雑用があれば手伝って、という具合でした。

私は基本的に部屋Bの方にいたので、Aのセッションが聞けていません… orz
Twitterのログやらスライドやら見てたら、「デブは電車に乗るな」とか謎ワードが目に飛び込んできましたよ!?

運営に参加して

こういったイベントの運営に関わるのはかなり久々のことでした。 おそらく、大学祭の実行委員やってた以来です。

私が参加してから4月25日当日までの数ヶ月間、大変でしたが苦ではありませんでした。
きっと、あんまり仕事しなかった圧倒的当事者意識を持った優秀なメンバーと一緒に携わることが出来たからです。

DroidKaigiの運営メンバーは、呼びかけで集まった有志のエンジニアです。
所属する会社はバラバラで、ミーティングの際には各社の社内用語が飛び交って、意思疎通に軽く難が出るという一風変わった出来事もありました。
それでも、issue tracker(GitHub)とチャットツール(Slack)があれば上手く行くあたり、流石はエンジニアの集まりという感じでした。

今回の盛況ぶりで、こういったイベントがAndroidのエンジニアに需要があるということが明確になりましたが、問題点も多々ありました。 特に、ご来場いただけなかった方々には申し訳なく思います。 DroidKaigi自体は終わりましたが、まだ反省会やらなんやら内々でやることは残ってます。 羊さんがクロージングトークで何やら話してましたしね。

何はともあれ、登壇して頂いた皆さん、ご来場頂いた皆さん、運営メンバーの皆さん、ありがとうございました。


  1. でも、てくぶのC87特設サイトも1週間くらいで作ってたから、毎度のことかと考えなおしつつある。
  2. なんとかりんごって奴がやった。
  3. 又聞きなので違ってたらすみません。

2015年4月30日木曜日

DroidKaigiのWebサイトの作り方

DroidKaigiに来ていただいたみなさん。ありがとうございました!

私は運営メンバーに参加して、Webサイトの構築・管理とかしてました。

CFP開始当初は時間がなかったので、私がえいやとBootstrapで作成。
ただし、公開前にデザイナーさんにアドバイスを頂いて細かい部分を手直ししたり、公開後も他のメンバーからガシガシPRを貰って手を入れていきました。
採択セッションの公開時のあたりで、デザインをゆりりーさんにお願いし、私が技術面を担当する体制に。

サイトはGitHub Pagesを使ってます。 今まではペライチのHTML置くくらいにしか使ってませんでしたが、DroidKaigiのサイトではも少しちゃんと機能を使ってます。

本記事ではその辺をまとめてみます。

※ Androidの話は全くしません。

リポジトリ

  • GitHub PagesのOrganization siteとしてリポジトリ作成
  • organizationname.github.ioという名前でリポジトリを作ると、masterブランチの内容が同名のURLで公開されます。
    • Organizationじゃなく、個人ユーザーの場合も同じ。
    • gh-pagesブランチを使うのはProject siteの場合です。
  • リポジトリはPrivateのままでもGitHub Pagesは公開できます。

CMS(Jekyll+Liquid)

  • GitHub PagesではJekyllが使えます。
    • ただし素のJekyllが使えるわけではなく、あくまでGitHub Pagesのgemを使う形になります。
  • 色々制約があるので、Using Jekyll with Pagesを要参照。
    • 例えば、_config.ymlsource:〜設定は無視されるので、常にリポジトリのトップレベルにソースを置く必要があります。
      これに気付かずpushしたら、30分ほどサイトがすっとんだ事がありました。
  • Jekyllのプラグインも決まったものしか使えません。
  • テンプレートエンジンはLiquid
  • アクセス時にページを書き出すのではなく、Jekyllの起動時(GitHub Pagesではpush時)に書き出しキャッシュするだけ。
    • なので、インタラクティブなWeb APIっぽいものを作る事は出来ません。
    • 実はセッションリストをjsonで取得できるようにしてあるんですが、それもLiquidで書き出してるだけです。
  • _data/の下にYAMLで任意のデータを置くとテンプレートから参照できます。
    • それでセッションリストのデータを持っています。
    • YAML書き換えるとページとjsonも勝手に書き換わります。
    • Jekyllでは普通_posts/2015-04-24-DroidKaigi.mdって感じのパスで記事を書いて行くようなんですが、 DroidKaigiのサイトではそれは使っていません。
  • Jeykyllで処理するファイルの先頭にはFront Matterを書きます。

テスト

  • YAML使ったり、json書き出したりとかしだしたので、CIでテストもするようにしました。
  • Travis CIで回してます。
  • テスト内容
    • ビルド
    • HTMLの構文チェック HTML::Proofer
    • favicon
    • リンク切れ
    • imgのalt属性のチェックはわざと無視。代替文字が必要なデザインじゃないので。
    • YAML,jsonの構文チェック(パースしてみてるだけ)

テストはとりあえずでいいやとインラインで書いちゃってるけど、どういう書き方がベターなんだろ。

Webフォント

英字はRoboto。日本語はNoto Sans。

その他

ちゃんとSEOとか知ってる人には常識だろうけど

  • 一度設定したOpenGraph用の画像を消す時は注意
    • サイトのmetaタグの画像パスなどを書き換えても、すぐにはFbは反映してくれない様です。
    • デザイン刷新時に古い画像を消したら、一時的にFbのシェア時に画像が出なくなってしまいました。
  • はてブとかツイートボタンとか、ソーシャルボタンはURLが明示的に指定できるならした方がいい
    • 指定がなければ勝手に現在のURLになる
    • http/httpsの違いや、ハッシュの有無で別のページとして扱われちゃう
    • canonical URLも書くべき <link rel="canonical" href="http://droidkaigi.github.io/"/>
  • ページランク
    • サイト公開直後はDroidKaigiで検索しても全然検索結果の上位に来なかった。5ページ目以降とか。
    • てくぶのコミケ用ページをGitHub Pagesで作った時もそうだったんですが、一月くらいは上がらない感じ。
    • 後からsitemap.xmlを用意したりとかしたけど、結局Googleがいつクロールしてくれるかはわからないので…

一緒に書いたけど、ソーシャルリンクについてはどちらかと言うとテクブのサイト作ってた時の知見。
あと、PRのブランチへにpushしたら、どっかにデプロイしてすぐ他の人がプレビュー出来るようにすればよかったなー、と気付いた。 レビューが捗る。

感想記事的なものは別に書きます。

2015年2月22日日曜日

DroidKaigiを開催します

2015年4月25日にDroidKaigiを開催します。2月25日まで講演者募集中です!

仕事では全然Android触ってませんが、なぜだか運営に参加してます。Webサイト作成とか手伝ったり。

もう締め切り間近ですが、講演(CFP)は2月25日まで募集中です。
25分枠と50分枠とあるので、ちょっとした知見があれば気軽に25分枠で応募してみてはいかがでしょうか。
私なんかは仕事でAndroid触ってすらいないのに、1つ応募していたりします。ちなみに、一人で複数応募してもOKですよ!
勿論、50分枠でも是非是非応募して下さい。「○○なら俺に任せろ!バリバリ小一時間喋らせろ!」って方、よろしくお願いします!

他の運営メンバーも各々紹介記事を書いています。どうぞご覧ください。

2014年11月1日土曜日

Android5.0での絵文字の変化

Android 4.4 KiatKatで導入された絵文字は、Unicodeの絵文字として作成されてはいますが、元はGoogleハングアウト用にデザインされたものでした。
そのため、Unicodeの定義とはズレたデザインになっていたり、表示に問題があったりしました。

Android 5.0 Lollipopでは、絵文字がUnicodeに寄せる形で色々と変更・修正されていますので、まとめてみました。

まぁ、どうせメーカー製機種では絵文字フォント差し替わってるから、Nexus機のだけ見てもしゃーないんだけどね!

絵文字についてはこちらの記事もどうぞ ↓

Androidが4.4で絵文字にちゃんと対応した
http://mstssk.blogspot.jp/2014/02/emoji.html

比較対象はN5(Android 4.4 ビルド:KTU84P)と、2013年版N7(Android 5.0 ビルド:LPX13D)です。
N7には http://developer.android.com/intl/ja/preview/index.html#Start の razor-lpx13d-preview-ae4f461f.tgz を焼きました。

大本のニュアンス的には間違ってはいなかった系

WOMANS HATは、元になったガラケーの絵文字がむぎわら帽子なのですが、emoji4unicodeでWOMANS HATという名称で正規化され、そのままUnicodeに入ってしまった様です。

Unicode文字KitKatLollipop名称/注釈
U+1F452👒WOMANS HAT
U+26F3FLAG IN HOLE
U+1F52B🔫PISTOL

本来のニュアンスが失われてしまった系

1つ目は、ドコモの「かわいい」という名前の花びらを象った絵文字なんですが、元のドット絵が花っぽくなくてよくわからない名称になり、そしてLollipopで名称に忠実によくわからない絵文字になりました。

鳥の絵文字は、ガラケーでは「ひよこ」だったり黄色い鳥だったりしましたが、ただの鳥になってしまいました。
別にひよこの絵文字はあるので、整理しただけかもしれません。

Unicode文字KitKatLollipop名称/注釈
U+1F4A0💠DIAMOND SHAPE WITH A DOT INSIDE
U+1F426🐦BIRD

デフォルメし過ぎていた系

完全にマンガ肉。けど、N5の方が美味しそうに見える…

Unicode文字KitKatLollipop名称/注釈
U+1F356🍖MEAT ON BONE
U+1F357🍗POULTRY LEG

なんかもう勝手に作っていたのを直した系

色違いよりは、バリエーションがあった方がたしかに良かったですね。

Unicode文字KitKatLollipop名称/注釈
U+1F499💙BLUE HEART
U+1F49A💚GREEN HEART
U+1F49B💛YELLOW HEART
U+1F49C💜PURPLE HEART

名称に忠実に・シンプルにした系

絵文字じゃなくただの記号っぽくなってしまった。

Unicode文字KitKatLollipop名称/注釈
U+1F170🅰NEGATIVE SQUARED LATIN CAPITAL LETTER A
U+1F171🅱NEGATIVE SQUARED LATIN CAPITAL LETTER B
U+1F17E🅾NEGATIVE SQUARED LATIN CAPITAL LETTER O
U+1F17F🅿NEGATIVE SQUARED LATIN CAPITAL LETTER P
U+1F18E🆎NEGATIVE SQUARED AB
U+1F191🆑SQUARED CL
U+1F192🆒SQUARED COOL
U+1F193🆓SQUARED FREE
U+1F194🆔SQUARED ID
U+1F195🆕SQUARED NEW
U+1F196🆖SQUARED NG
U+1F197🆗SQUARED OK
U+1F198🆘SQUARED SOS
U+1F199🆙SQUARED UP WITH EXCLAMATION MARK
U+1F19A🆚SQUARED VS
U+1F21A🈚SQUARED CJK UNIFIED IDEOGRAPH-7121
U+1F22F🈯SQUARED CJK UNIFIED IDEOGRAPH-6307
U+1F232🈲SQUARED CJK UNIFIED IDEOGRAPH-7981
U+1F233🈳SQUARED CJK UNIFIED IDEOGRAPH-7A7A
U+1F234🈴SQUARED CJK UNIFIED IDEOGRAPH-5408
U+1F235🈵SQUARED CJK UNIFIED IDEOGRAPH-6E80
U+1F236🈶SQUARED CJK UNIFIED IDEOGRAPH-6709
U+1F237🈷SQUARED CJK UNIFIED IDEOGRAPH-6708
U+1F238🈸SQUARED CJK UNIFIED IDEOGRAPH-7533
U+1F239🈹SQUARED CJK UNIFIED IDEOGRAPH-5272
U+1F23A🈺SQUARED CJK UNIFIED IDEOGRAPH-55B6
U+1F250🉐CIRCLED IDEOGRAPH ADVANTAGE
U+1F251🉑CIRCLED IDEOGRAPH ACCEPT
U+261DWHITE UP POINTING INDEX
U+2600BLACK SUN WITH RAYS
U+2601CLOUD
U+260EBLACK TELEPHONE
U+267BBLACK UNIVERSAL RECYCLING SYMBOL
U+26A0WARNING SIGN
U+2709ENVELOPE
U+270CVICTORY HAND

消えた丸が帰ってきた系

そもそもなぜ丸が無かったのか。

Unicode文字KitKatLollipop名称/注釈
U+3297CIRCLED IDEOGRAPH CONGRATULATION
U+3299CIRCLED IDEOGRAPH SECRET
U+24C2CIRCLED LATIN CAPITAL LETTER M

差別問題に配慮した系

肌の色が抜かれたり、人物がすべて謎のキャラクター進捗さん(1)になったりしています。 NAIL POLISH(マニキュア)も、人の指が写っていたので変更されています。
しかし一方で、GUARDSMANは英国の近衛兵の図柄のままになっていたり中途半端?です。
Unicode文字KitKatLollipop名称/注釈
U+1F440👀EYES
U+1F442👂EAR
U+1F443👃NOSE
U+1F444👄MOUTH
U+1F445👅TONGUE
U+1F466👦BOY
U+1F467👧GIRL
U+1F468👨MAN
U+1F469👩WOMAN
U+1F46E👮POLICE OFFICER
U+1F46F👯WOMAN WITH BUNNY EARS
U+1F470👰BRIDE WITH VEIL
U+1F471👱PERSON WITH BLOND HAIR
U+1F472👲MAN WITH GUA PI MAO
U+1F473👳MAN WITH TURBAN
U+1F474👴OLDER MAN
U+1F475👵OLDER WOMAN
U+1F476👶BABY
U+1F477👷CONSTRUCTION WORKER
U+1F478👸PRINCESS
U+1F47C👼BABY ANGEL
U+1F481💁INFORMATION DESK PERSON
U+1F483💃DANCER
U+1F485💅NAIL POLISH
U+1F486💆FACE MASSAGE
U+1F487💇HAIRCUT
U+1F48F💏KISS
U+1F491💑COUPLE WITH HEART
U+1F38E🎎JAPANESE DOLLS
U+1F4AA💪FLEXED BICEPS

合成文字の不具合を修正した系

以前にAOSPのIssue Trackerに上げた問題が解決したようです。
https://code.google.com/p/android/issues/detail?id=66045

Unicode文字KitKatLollipop名称/注釈
U+1F1E8 U+1F1F3🇨🇳REGIONAL INDICATOR SYMBOL LETTERS CN
U+1F1E9 U+1F1EA🇩🇪REGIONAL INDICATOR SYMBOL LETTERS DE
U+1F1EA U+1F1F8🇪🇸REGIONAL INDICATOR SYMBOL LETTERS ES
U+1F1EB U+1F1F7🇫🇷REGIONAL INDICATOR SYMBOL LETTERS FR
U+1F1EC U+1F1E7🇬🇧REGIONAL INDICATOR SYMBOL LETTERS GB
U+1F1EE U+1F1F9🇮🇹REGIONAL INDICATOR SYMBOL LETTERS IT
U+1F1EF U+1F1F5🇯🇵REGIONAL INDICATOR SYMBOL LETTERS JP
U+1F1F0 U+1F1F7🇰🇷REGIONAL INDICATOR SYMBOL LETTERS KR
U+1F1F7 U+1F1FA🇷🇺REGIONAL INDICATOR SYMBOL LETTERS RU
U+1F1FA U+1F1F8🇺🇸REGIONAL INDICATOR SYMBOL LETTERS US
0U+20E30⃣KEYCAP 0
1U+20E31⃣KEYCAP 1
2U+20E32⃣KEYCAP 2
3U+20E33⃣KEYCAP 3
4U+20E34⃣KEYCAP 4
5U+20E35⃣KEYCAP 5
6U+20E36⃣KEYCAP 6
7U+20E37⃣KEYCAP 7
8U+20E38⃣KEYCAP 8
9U+20E39⃣KEYCAP 9
#U+20E3#⃣HASH KEY

それはミスじゃないのか系

「?」が先にくるのは「⁈」(QUESTION EXCLAMATION MARK)じゃないのかな…

Unicode文字KitKatLollipop名称/注釈
U+2049EXCLAMATION QUESTION MARK

シャープになった系

文字のプロポーションがスッキリしつつ良くなったりしています。

Unicode文字KitKatLollipop名称/注釈
U+2194LEFT RIGHT ARROW
U+2195UP DOWN ARROW
U+2196NORTH WEST ARROW
U+2197NORTH EAST ARROW
U+2198SOUTH EAST ARROW
U+2199SOUTH WEST ARROW
U+21A9LEFTWARDS ARROW WITH HOOK
U+21AARIGHTWARDS ARROW WITH HOOK
U+2660BLACK SPADE SUIT
U+2663BLACK CLUB SUIT
U+2665BLACK HEART SUIT
U+2666BLACK DIAMOND SUIT
U+2668HOT SPRINGS
U+2B50WHITE MEDIUM STAR
U+2B55HEAVY LARGE CIRCLE
U+3030WAVY DASH
U+303DPART ALTERNATION MARK
U+25FBWHITE MEDIUM SQUARE
U+25FCBLACK MEDIUM SQUARE
U+25FDWHITE MEDIUM SMALL SQUARE
U+25FEBLACK MEDIUM SMALL SQUARE
U+26BDSOCCER BALL
U+26BEBASEBALL
U+2702BLACK SCISSORS
U+2934ARROW POINTING RIGHTWARDS THEN CURVING UPWARDS
U+2935ARROW POINTING RIGHTWARDS THEN CURVING DOWNWARDS

太ましくなった系

マッシヴに。

Unicode文字KitKatLollipop名称/注釈
U+25B6BLACK RIGHT-POINTING TRIANGLE
U+25C0BLACK LEFT-POINTING TRIANGLE
U+26AAMEDIUM WHITE CIRCLE
U+26ABMEDIUM BLACK CIRCLE
U+2712BLACK NIB
U+2714HEAVY CHECK MARK
U+2716HEAVY MULTIPLICATION X
U+2757HEAVY EXCLAMATION MARK SYMBOL
U+2764HEAVY BLACK HEART
U+27A1BLACK RIGHTWARDS ARROW
U+2B05LEFTWARDS BLACK ARROW
U+2B06UPWARDS BLACK ARROW
U+2B07DOWNWARDS BLACK ARROW
U+270FPENCIL
U+2744SNOWFLAKE
U+2708AIRPLANE
U+2747SPARKLE

あやうく違いに気付かなかった系

雪だるまは口角が上がり、カクテルはサクランボのヘタの色が変わったりしています。

Unicode文字KitKatLollipop名称/注釈
U+26C4SNOWMAN WITHOUT SNOW
U+1F378🍸COCKTAIL GLASS

単純な改善系

N5では何のための絵文字がわかりませんでしたが、新しい方だとピンときます。

Unicode文字KitKatLollipop名称/注釈
U+2139INFORMATION SOURCE

なんとも言い難い系

元になったauの悪魔の絵文字は笑っているというよりムッとしている感じで、N5の図柄の方が近い気がします。
しかしemoji4unicodeで笑った感じの絵にされてしまい、そのままUnicodeに入ってしまったようです。

U+1F608😈SMILING FACE WITH HORNS

表情の表現の仕方の違い系

笑顔はともかく、焦り顔系は色がどぎつい…

Unicode文字KitKatLollipop名称/注釈
U+1F603😃SMILING FACE WITH OPEN MOUTH
U+1F606😆SMILING FACE WITH OPEN MOUTH AND TIGHTLY-CLOSED EYES
U+1F630😰FACE WITH OPEN MOUTH AND COLD SWEAT
U+1F631😱FACE SCREAMING IN FEAR
U+1F635😵DIZZY FACE

その変更は必要だったの?系

なぜ小さくした。

Unicode文字KitKatLollipop名称/注釈
U+2B1BBLACK LARGE SQUARE
U+2B1CWHITE LARGE SQUARE

参考

追記 2014-11-27

REGIONAL FLAGSが増えてた。

追記 2015-03-06

228じゃなく、229だった。EUも追加されている。
  1. 某所で勝手にこう呼ばれています。