株式会社ワークスアプリケーションズが主催するエンジニアによるイベントです。

こちらでも随時情報を公開しますので、フォローお願いします。 facebook twitter wantedly

イベント概要

ここ10年のブラウザの進化によってブラウザ上で色々なことが出来るようになりました。

業務アプリケーションにおいても従来のページ遷移方式ではなく、動的な UI でユーザビリティを高めるのは当たり前になっています。そこで最近では、より開発を簡単に行える従来デファクトスタンダードであった jQuery に変わり、 React のような画期的なフレームワークが多数登場しています。その中でいかに堅牢性を高めていけば良いのでしょうか。

また大人数でのソフトウェア開発していく過程において、デザインの統一に関してもユーザービリティを高めるために重要です。 デザインを開発者の負担にならずにどのように統一していくのか、加えてシステムに仕組みとしてどのように組み込んでいくのか、といった問題点もあります。

今回はそんなソフトウェア開発における 「UIアーキテクチャ」と「デザインシステム」 をテーマとして勉強会を開催します。

WebフロントエンドのUIアーキテクチャ

JavaScript を使った複雑なアプリケーションを構築するのは容易ではありません。
最近では、従来デファクトスタンダードであった jQuery に変わり、 React のような画期的なフレームワークが多数登場しています。
これだけでも開発は楽になるのですが、さらに堅牢性を高める手段として Elm （※1）に注目しています。
従来のライブラリ（たとえば jQuery）から React のような設計を採用することのメリットを、設計の背景から順を追ってお伝えします。
Elmに関しては実運用に向けての導入観点や、実例として作成した社内アプリも併せてご紹介します。

※1．Elm は次のような優れた特徴を持ったフロントエンド専用のプログラミング言語です。
・強い静的型付け（実行時例外ゼロ！）
・親切なエラーメッセージ
・高速な Virtual DOM 実装
・React & Redux 風のアーキテクチャ（The Elm Architecture）
・Semantic Versioning の強制
・JavaScript との相互運用（Port）

デザインシステム

開発プラットフォームにデザインを組み込み、プロダクトを美しくすることと使い勝手を両立することを目指し、
描画速度が遅くなるアンチパターンをどのように把握して、レギュレーションチェックやフレームワークで解決していくのか、実行していく上での失敗パターンなど事例共有や運用ノウハウをお伝えします。
またデザインの良さの指標についても、ユーザビリティリサーチを行うことで発見できた内容を事例としてご紹介します。

実装が難しかった複雑なUIに直面している方には、実装に秩序を生み、バクのないUIを作れるよう有益な実例を ご紹介したいと思います！
ぜひ、ご参加ください！

▼こんな方におすすめ

• フロントエンドエンジニアの方

• フロンドエンドのデザイナーの方

• Bootstrapなどデザインシステム／フレームワークをご検討中の方

• 複雑な画面を実装するのが難しいと感じている方

• jQuery のつぎはぎでメンテナンスできなくなった方

• React の代わりを探している方

• Elmにご興味のある方

タイムテーブル

登壇者プロフィール

株式会社ワークスアプリケーションズ 鳥居陽介 氏

登壇者 参考記事
・略歴　　

大学は機械系で情報と関係なかったが、定食屋に張り出されていたプログラミング課題を解いて 応募したところ技術基盤に採用された。
仕事は、分散バッチフレームワーク開発、社内システム開発、HUE 開発を経て現在は主にフロントエンドの アーキテクチャ研究。

・パーソナリティ　　

創作全般を好物としている。
幼稚園での迷路製作から始まり、漫画、ゲーム製作、作曲、プログラミングと、絶えず何かを創り続けていないと死んでしまう。
直近では Elm でホームページと MIDI+MP3 プレイヤーを作成。

・トーク内容（仮）　　　

Webフロントエンドアーキテクチャの歴史とフレームワークの比較
React がすごくて Elm がもっとすごい話
社内アプリケーションを Elm で作ってみた話
Elm ミートアップへのお誘い

株式会社ワークスアプリケーションズ 佐藤廣 氏

登壇者 参考記事

・略歴

田舎のデザイン事務所の子として生まれ、大学では語学やコンピュータサイエンスを学ぶ。
ワークスアプリケーションズにはエンジニアとして就職し、様々な縁でUI/UXの部門に。
最近は、デザインに関わる問題の仕組みによる解決や、問題見極めのための直接サポート等に取り組む。

・パーソナリティ

好きなのは、JavaよりJavascript、SassよりLESS、CSS-in-JSよりCSS Module。
休日はもっぱら子供と公園に、息抜きにチェロをやっています。
こちらで好きなのはバッハよりコレルリ、ベートーヴェンよりモーツァルト、ブラームスよりメンデルスゾーン。

・トーク内容（仮）

より複雑なアプリケーション、Enterprise、デザインといったキーワードが組み合わさった時に起こる問題。
多くの企業で取り組まれ始めている対策や工夫。
実践する中でとくに効果をあげている策、仕組み。

開催場所

株式会社ワークスアプリケーションズ　赤坂溜池タワー (受付：13階)

※本社のアークヒルズとは場所が異なります。

当日持ち物

名刺2枚（参加者確認のため、受付時に頂戴します）

※学生の方は、名刺は不要です。

留意事項

• ワークスアプリケーションズの説明をさせて頂く時間がございます。

• 予定・プログラム内容は変更となる場合があります。

• エンジニアを対象としたイベントのため、同業に属する方の当イベント内でのリクルーティング活動につきましてはご遠慮頂いております。

• 参加人数に限りがございますので、事前にご参加が難しくなった際は早めにキャンセルのご協力をお願いいたします。

• イベントの様子を撮影・録画し、弊社SNSなどで公開させていただきます。

誠に恐れ入りますが、予めご了承ください。

個人情報の取り扱い

主催：株式会社ワークスアプリケーションズ

申し込み時にご提供いただいた情報は、イベント受付管理や各種ご案内（サービス・イベント等）に利用させていただきます。