開局から７年を迎える新しい未来のテレビ「ABEMA（アベマ）」は、“テレビの再発明“に挑戦しています。 昨年に開催された「FIFA ワールドカップ カタール 2022」では全64試合無料生中継を実施し、デイリーアクティブユーザーが 1700万人を突破、ウィークリーアクティブユーザーが3400万人を突破するなど多くの日本の皆様に視聴していただきました。 今年の「ABEMA Developer Conference 2023」のコンセプトは「日本が熱狂できる場を作るABEMAの挑戦と挑戦からみえた新しい未来」です。 本大会に向けて技術者が５つの挑戦、「サービスを絶対に落とさない」、「サッカー観戦に最適化したUIUX」、「地上波レベルの高画質配信」、「マルチデバイス」、「ハイライトの最速配信」に取り組みました。 この５つの挑戦の過程とそれを乗り越えたからこそ見えた新しい未来についてお伝えします。

本記事は、CyberAgent Advent Calendar 2022 2日目の記事です。 この記事のまとめ ABEMA では、試合のデータにアクセスしやすいデザインに取り組みました 既存サービスと比較して、1画面に収まる情報量を増やしました 国やチームの色を見やすく自動調整する仕組みをいれました ABEMA で配信する FIFA ワールドカップ カタール 2022 の全試合で体験できます 「いつでも、どこでも、ワールドカップをすべてのひとに。」 FIFA ワールドカップ カタール 2022 は、ABEMA で全試合を無料で提供しています。当初のキャッチコピーは、「いつでも、どこでも、ワールドカップをすべてのひとに。」でした。 「いつでも、どこでも、ワールドカップをすべてのひとに。」 映像を届けることはもちろんですが、すべてのひとに FIFA ワールドカップ カタール 2022 を楽しん

at DevSumi 2018

たくさんある道具をどのように組み合わせるか 今回はコード設計編のつもりでしたが、ビルド周りを先にまとめることにしました。主にパフォーマンス上の都合ですが、心がけたポイントは次の点です。 画一的なバンドルではなく、適切なバンドルを選択的に配信できるようにする 適当な粒度で Code Splitting できるようにする ひとつのツールに何でもかんでもやらせない（ webpack、お前のことだよ！） ビルドのパイプラインを短く、シンプルに済ませる（できることを全てやろうとしない） タスクランナーは前回述べた通り make を利用しています。同僚が使っているのを見てパクりましたが Self-Documented Makefile の手法が、タスク名忘れに優しくてよかったです。 npm run したら npm scripts が一覧で出てくるのと似たようなやつです。 このシリーズの他の記事はこちら

普段、インターネット上ではただのゲーム好きとして活動（？）しておりますが、本職はWebサービスやスマートフォンアプリのUIデザイナーをやらせていただいております コウノ アスヤ（@asuyakono）です。 退勤後はイベントに登壇！土日はコンセプトデザインで習作！みたいな同僚を横目に、仕事の時間以外はもっぱら家にこもってゲームを遊び、プレイ後に感想を記事にしてネットに公開することが多いです。それがこのブログです。このブログではいつも「良いも悪いも正直に。なるべく平易な文で。」をモットーに書いてますが、記事のボリュームを考えたり、専門的すぎないように気をつけていると、どうしてもなくなく端折らざるを得ない話題というものがあります。 それは、ゲームにおける「インタラクション・デザイン」のことです。 「友達が少ない」「インドア」「両親が共働き」の３本揃いで、物心ついた時から１人で黙々とビデオゲーム

注意。実装はまだないです。思考実験的な意味合いが強いです。 持論 Reactやredux/Rxのデータモデリング手法の発達で、ツリー構造の末端に渡すまでのデータモデリングが主戦場になりつつあります。これはロジックを注入する部分と、プレゼンテーショナルなものが明確に分離されてきたことを意味します。 僕は個人的に、 GUI にまつわるものは、本来GUIで設計したい、という気持ちがあります。そう、僕が作りたいと思っているのは、悪名高きホームページビルダーです。 とはいえ、プログラミング抜きでxxxできる！というものではありません。むしろプログラミングとGUIを横断するイメージで、Unity や UnrealEngine のような開発環境を想定しています。 今やりたい理由 ブラウザの仕様が安定してきた 色々と使えるパーツが増えた JS で複雑なツールを作れるようになり、インブラウザな開発ツールが作

全3回の連載予定の「サブスクリプションの見える化」シリーズ。 4日前（12/11）の記事では、おかげさまで、Twitter、はてぶ、NewsPicks などでたくさんの反響をいただいています。ありがとうござます。 また、noteのサポート機能からご入金もいただきました。※見慣れない通知だなーと思って調べて初めて知ったのですが、10月にも複数の方から、サポートをいただいていました。大変遅くなってしまいましたが、この場をお借りして、ありがとうございます。（営利目的ではありませんが、わたしの記事を通してサポートしようと思っていただけたということが何よりうれしいです。） さて、今回は連載の第2回です。前回に引き続き、私自身がBtoBのサブスクリプションのビジネスでマーケティングやデータ分析を担当している経験をもとに、個別から全体、現在から未来に向けて、以下の3つの目的に合わせて考えていきます。 ～

好きなギタリストは？と問われると困る。そのときの気分によるのです。ちなみに今はデレクトラックスがすごく好き。 さいきん、と言っても２ヶ月前くらいにライブアルバムをテデスキトラックスバンドで流通させていた。オークランドのライブアルバム、これが途轍もなく生生しくも洗練されたバンドの音をかもし出していた。 このバンドではあまりデレクは弾いていないのだけどもそのバンドに徹する奥ゆかしさがとても好き。まぁ弾きまくる初期のソロも好きですが。 しかしずっと聴いているのは「REVELATOR」というアルバムであって、これがまじでさいきんのお気に入りである。とりあえず、なに聴こうかなぁってときにはこればっか聴いている。めちゃ良い。 Revelator アーティスト: Tedeschi Trucks Band 出版社/メーカー: Sony Legacy 発売日: 2011/06/07 メディア: CD 購入:

晒すつもりではありませんが、Facebook で友人のとある投稿を見かけて最初は「三単現にしないと💢」という軽い気持ちで返答したのですが、よくよく考えて見たらこれ思った以上のクソ命名でしたので、とりあえず流れのスクショを上げときます： はい、今回の記事はマサカリです。あしからず。 見ての通り、最初は友人の後輩ちゃんが isCanUseSkill という明らかにアレな命名をしてきたので、友人がそれを指摘をするも、まさかの allowSkill という更にダメな名前をつけてきた件。isCanUseSkill はまだ「なんだこいつの英語はｗｗｗ」という意図はわかるから笑って済ませそうな名前ですが、allowSkill は「これは命令なのか Yes-Or-No 質問を間違えて命令にしちゃったのか💢」という、書いた本人がもし友人じゃなかったら絶対引きずり出して小 1 時間殴りたいレベルのクソ名前

ブロックチェ－ンの仕組みを知るには構築するのが最短の方法 この記事を読んでいるということは、仮想通貨の拡大に興奮しているということですね。ブロックチェ－ンの仕組み、背後にある基本的なテクノロジーについて知りたいのでしょう。 しかしブロックチェ－ンを理解するのは簡単ではありません。少なくとも私にはそうでした。大量の動画の中をさまよい、抜けだらけのチュートリアルに従い、結局、実例が少なすぎてフラストレーションが大きくなりました。 私は手を動かして学ぶのが好きです。コードのレベルで内容を扱わざるを得なくなり、そうすることで身に付くからです。同じようにやってもらえば、この解説が終わる頃には、機能するブロックチェーンが出来上がり、どのように動くかがしっかりと把握できるようになるでしょう。 準備 ブロックチェ－ンとはブロックという名の 不変でシーケンシャルな 一連のレコードだということを覚えてください

株式会社rootのUIデザイナー 古里祐哉です（@remmyfurusato）。 rootでは、サービスの立ち上げやリニューアルに伴う、UI/UXデザインをご支援しています。 さて、今年を振り返えると「デザインガイドラインに注力した」年でした。デザインガイドラインを必要とされるクライアント様には共通点があります。 ・レイアウトパターンやパーツの使い方が定義されていないで、設計者やエンジニアが迷う。 ・結果、サービス全体の一貫性がなく使いづらい。 このような課題を抱えるクライアント様からのご依頼を多くいただきました。サービス開発の現場で、徐々にデザインガイドラインの重要性が広まってきているのではないでしょうか。 デザインガイドライン作成を通して考えたことをまとめたいと思います。 デザインガイドラインとは？ デザインガイドラインの定義は「サービスやプラットフォームのデザイン方針を示したドキュメ

「自宅での手洗い洗車」というのは、車好きだけのたしなみと思っていないでしょうか？ 筆者の周りを見ていると そんな人が意外に多いと感じています。 たとえば筆者の友人で去年軽自動車を買ったK君は、車の汚れにあまり気を留めていませんでした。 どうしても泥だらけになってきたな…と思った時は、ガソリンスタンドの洗車機を使っていたそうです。 しかしある時、仕事帰りに彼の車を見せてもらうと、パッと見では分かりませんが無数の小キズがついていました。 去年買った車とは思えないレベルです。 それを伝えると「ちゃんと洗車していたのに何で？」と結構なショックを受けていました。 もちろん、洗車機にもメリットはあります。 車を初めて持ったばかりの方でも、給油ついでにサッと洗える手軽さが一番のメリットです。 しかし洗車機に頼りすぎると、数年にわたって乗り続ける愛車がダメージを受けてしまうかもしれません。 筆者としては、

TL;DR 突然ですがクイズです。「追跡ブランチ (tracking branch)」という言葉の使い方で正しいのはどれだと思いますか？ origin/master はリモートリポジトリの master を追跡する追跡ブランチである origin/master はローカルの master に追跡される追跡ブランチである ローカルの master は origin/master を追跡する追跡ブランチである 現在の正解は多分3番です。過去には1番でした。 分からなかった方、分かったけど他人に「追跡ブランチ」と言って伝わるか不安な方。大丈夫です。正確な用語1で言い換えることにしましょう。 origin/master はリモートリポジトリの master を追跡するリモート追跡ブランチ (remote-tracking branch)である origin/master はローカルの master

第1回: JavaScriptでフルスクラッチゲーム開発しよう 第1回 準備編 第2回: JavaScriptでフルスクラッチゲーム開発しよう 第2回 画像読み込み編 第3回: JavaScriptでフルスクラッチゲーム開発しよう 第3回 画像表示編 前回は、背景とみかん箱を表示するところまで出来ました。 今回は、みかん箱を動かしてみます。 みかん箱の表示座標を管理する みかん箱をX軸座標で動かすことを想定して、それを管理する変数を用意します。 : // みかん箱の表示X軸座標位置 var mikanX = 0; : function render() { : // みかん箱を表示 ctx.drawImage(Asset.images['box'], mikanX, 0); } これでmikanXの値を変えることで、みかん箱のX軸座標の表示位置を変えることができました。 では、どのタイミン

OODAふりかえり 何って…ただ毎スプリント、違うふりかえり手法を採用してるだけだが？ / Retrospectives with OODA

今年のAdobe MAXの話題は、人工知能「Adobe Sensei」一色だった。 ステルスぎみのAI企業だったAdobeが、いよいよ浮上してきた今回のMAX 2017。 数年前から「AdobeはAI銘柄」と言い続けてきた僕としては、とても感慨深い。 以下、自身の雑感まとめ。大きな戦略レイヤーの話がメインなので、個々のテックはICSさんの記事などをご参考。 ＊注 筆者はAdobe社から、Adobe MAX 2017への招待を受けて参加しています。ですが、それはそれとして中立で書きます。Adobeさん都合の悪いこと書いてたらごめんなさい。前半エントリではAdobeのAI戦略を理解する前提として、「AdobeがAIや未来に投資しだした背景」、「Adobeのビジネス構造」の2つを論じる。 AI戦略の始まりは月額課金へのシフト まず最初に、AdobeがAIプレイヤーとして、急速に浮上してきた背景を

我々のインタラクションデザイナーである Alla Kholmatova が FutureLearn での Atomic Design の利用の状況について考察します。 1年前、私たちは FutureLearn での最初のパターンライブラリ開発について、そしてなぜ我々が Atomic Design を使うことになったのかについて著しました。 全般的に、Atomic Design は我々のチーム内でうまく機能しています。それはインターフェイスの理解の共有や、さらなるモジュール化への移行、我々のデザイン言語の進化などに貢献しました。 Atomic Design におけるいくつかのコンセプトについては最初から明確でしたが、その他はあいまいに感じていました。例えば、我々の理解がまだ不十分な分野は、molecules と organisms の違いについてです。 Brad Frost は、molecu

「企業は人なり」とは言うけれど、この世でイチバンわからないのも人、ですよね。「どうすれば成長してくれるの?」「なぜ採用がうまくいかないの?」などなど、経営者の悩みは尽きません。そんな“人事にまつわるリアルな質問”にサイバーエージェント取締役 人事統括の曽山さんが回答する新連載がスタート。今回は“プロローグ編”として、曽山さんの“人事哲学”、大切にしていることを聞きました。大げさじゃなくて、経営者必読、です。 「人事戦略」は経営課題を解決する手段 ―「採用・育成などの人事施策に力を入れようと思っても、結局、どこから手をつけていいのかわからない」。ベンチャー企業の経営者と話をしていると、そんなため息を聞くことが珍しくありません。曽山さんが社員数十名の無名ベンチャーの人事責任者だったとしたら、なにから手をつけますか。 僕が人事施策に着手するとき、決めていることがあります。それは「経営課題はなにか