Submit Search
Upload
SDUI
•
0 likes
•
19 views
S
ssuserd1783c
Follow
About Server Driven UI
Read less
Read more
Engineering
Report
Share
Report
Share
1 of 16
Download now
Download to read offline
Recommended
SDUI
SDUI
ssuserd1783c
OpenCVをAndroidで動かしてみた
OpenCVをAndroidで動かしてみた
徹 上野山
17 E-5 震災とHackとクラウドと 亀渕分
17 E-5 震災とHackとクラウドと 亀渕分
Keiji Kamebuchi
Adobe セッション for Enterprise x HTML5 Web Application Conference 2014
Adobe セッション for Enterprise x HTML5 Web Application Conference 2014
Tsuyoshi Nakao
AUGM Tokyo 2013 Adobe Creative Cloud のご紹介
AUGM Tokyo 2013 Adobe Creative Cloud のご紹介
Tsuyoshi Nakao
デバイス WebAPI設計の進め方
デバイス WebAPI設計の進め方
Device WebAPI Consortium
WebIntentsにより拓かれる次のWeb
WebIntentsにより拓かれる次のWeb
Kensaku Komatsu
HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解
Monaca
Recommended
SDUI
SDUI
ssuserd1783c
OpenCVをAndroidで動かしてみた
OpenCVをAndroidで動かしてみた
徹 上野山
17 E-5 震災とHackとクラウドと 亀渕分
17 E-5 震災とHackとクラウドと 亀渕分
Keiji Kamebuchi
Adobe セッション for Enterprise x HTML5 Web Application Conference 2014
Adobe セッション for Enterprise x HTML5 Web Application Conference 2014
Tsuyoshi Nakao
AUGM Tokyo 2013 Adobe Creative Cloud のご紹介
AUGM Tokyo 2013 Adobe Creative Cloud のご紹介
Tsuyoshi Nakao
デバイス WebAPI設計の進め方
デバイス WebAPI設計の進め方
Device WebAPI Consortium
WebIntentsにより拓かれる次のWeb
WebIntentsにより拓かれる次のWeb
Kensaku Komatsu
HTML5 クロスプラットフォームアプリ開発の現実解
HTML5 クロスプラットフォームアプリ開発の現実解
Monaca
Ruby on azure で game server service
Ruby on azure で game server service
nagachika t
Solaris11で深化するクラウド
Solaris11で深化するクラウド
Yasushi Taki
実践 Web App for Containers! ~コンテナ開発の基礎からDevOps環境の構築まで~
実践 Web App for Containers! ~コンテナ開発の基礎からDevOps環境の構築まで~
Saki Homma
Web intents addendum
Web intents addendum
html5j
Amazon QuickSight の組み込み方法をちょっぴりDD
Amazon QuickSight の組み込み方法をちょっぴりDD
Amazon Web Services Japan
Developer summit continuous deliveryとjenkins
Developer summit continuous deliveryとjenkins
Kohsuke Kawaguchi
cordova/electronの構造を知る
cordova/electronの構造を知る
Yasuharu Seki
【17-E-2】Ruby PaaS「MOGOK」 ~ ソフトウェアエンジニアのためのクラウドサービス ~ 藤原秀一氏
【17-E-2】Ruby PaaS「MOGOK」 ~ ソフトウェアエンジニアのためのクラウドサービス ~ 藤原秀一氏
Developers Summit
20140926 vd iand_azure_slideshare
20140926 vd iand_azure_slideshare
Osamu Takazoe
リモート・スマホ・シェアリング
リモート・スマホ・シェアリング
NTT Resonant Technology Inc.
モバイルコンテンツ制作を効 率化するツールを使いこなせ
モバイルコンテンツ制作を効 率化するツールを使いこなせ
Keisuke Todoroki
Google Compute EngineとPipe API
Google Compute EngineとPipe API
maruyama097
Google Compute EngineとGAE Pipeline API
Google Compute EngineとGAE Pipeline API
maruyama097
Windows azureって何
Windows azureって何
Kana SUZUKI
Adobe Anywhere for Video
Adobe Anywhere for Video
Dell TechCenter Japan
クラウドサービスを使って作る動画サイト?
クラウドサービスを使って作る動画サイト?
Daichi Isami
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
Keisuke Todoroki
XDev2010 WindowsAzure
XDev2010 WindowsAzure
Shinichiro Isago
Adobe Edge Inspectを利用してデバッグ
Adobe Edge Inspectを利用してデバッグ
Keisuke Todoroki
Introduction to web development 1
Introduction to web development 1
hideaki honda
More Related Content
Similar to SDUI
Ruby on azure で game server service
Ruby on azure で game server service
nagachika t
Solaris11で深化するクラウド
Solaris11で深化するクラウド
Yasushi Taki
実践 Web App for Containers! ~コンテナ開発の基礎からDevOps環境の構築まで~
実践 Web App for Containers! ~コンテナ開発の基礎からDevOps環境の構築まで~
Saki Homma
Web intents addendum
Web intents addendum
html5j
Amazon QuickSight の組み込み方法をちょっぴりDD
Amazon QuickSight の組み込み方法をちょっぴりDD
Amazon Web Services Japan
Developer summit continuous deliveryとjenkins
Developer summit continuous deliveryとjenkins
Kohsuke Kawaguchi
cordova/electronの構造を知る
cordova/electronの構造を知る
Yasuharu Seki
【17-E-2】Ruby PaaS「MOGOK」 ~ ソフトウェアエンジニアのためのクラウドサービス ~ 藤原秀一氏
【17-E-2】Ruby PaaS「MOGOK」 ~ ソフトウェアエンジニアのためのクラウドサービス ~ 藤原秀一氏
Developers Summit
20140926 vd iand_azure_slideshare
20140926 vd iand_azure_slideshare
Osamu Takazoe
リモート・スマホ・シェアリング
リモート・スマホ・シェアリング
NTT Resonant Technology Inc.
モバイルコンテンツ制作を効 率化するツールを使いこなせ
モバイルコンテンツ制作を効 率化するツールを使いこなせ
Keisuke Todoroki
Google Compute EngineとPipe API
Google Compute EngineとPipe API
maruyama097
Google Compute EngineとGAE Pipeline API
Google Compute EngineとGAE Pipeline API
maruyama097
Windows azureって何
Windows azureって何
Kana SUZUKI
Adobe Anywhere for Video
Adobe Anywhere for Video
Dell TechCenter Japan
クラウドサービスを使って作る動画サイト?
クラウドサービスを使って作る動画サイト?
Daichi Isami
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
Keisuke Todoroki
XDev2010 WindowsAzure
XDev2010 WindowsAzure
Shinichiro Isago
Adobe Edge Inspectを利用してデバッグ
Adobe Edge Inspectを利用してデバッグ
Keisuke Todoroki
Introduction to web development 1
Introduction to web development 1
hideaki honda
Similar to SDUI
(20)
Ruby on azure で game server service
Ruby on azure で game server service
Solaris11で深化するクラウド
Solaris11で深化するクラウド
実践 Web App for Containers! ~コンテナ開発の基礎からDevOps環境の構築まで~
実践 Web App for Containers! ~コンテナ開発の基礎からDevOps環境の構築まで~
Web intents addendum
Web intents addendum
Amazon QuickSight の組み込み方法をちょっぴりDD
Amazon QuickSight の組み込み方法をちょっぴりDD
Developer summit continuous deliveryとjenkins
Developer summit continuous deliveryとjenkins
cordova/electronの構造を知る
cordova/electronの構造を知る
【17-E-2】Ruby PaaS「MOGOK」 ~ ソフトウェアエンジニアのためのクラウドサービス ~ 藤原秀一氏
【17-E-2】Ruby PaaS「MOGOK」 ~ ソフトウェアエンジニアのためのクラウドサービス ~ 藤原秀一氏
20140926 vd iand_azure_slideshare
20140926 vd iand_azure_slideshare
リモート・スマホ・シェアリング
リモート・スマホ・シェアリング
モバイルコンテンツ制作を効 率化するツールを使いこなせ
モバイルコンテンツ制作を効 率化するツールを使いこなせ
Google Compute EngineとPipe API
Google Compute EngineとPipe API
Google Compute EngineとGAE Pipeline API
Google Compute EngineとGAE Pipeline API
Windows azureって何
Windows azureって何
Adobe Anywhere for Video
Adobe Anywhere for Video
クラウドサービスを使って作る動画サイト?
クラウドサービスを使って作る動画サイト?
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
無償でここまで使えるアドビのWeb制作ツール for デブサミ2013
XDev2010 WindowsAzure
XDev2010 WindowsAzure
Adobe Edge Inspectを利用してデバッグ
Adobe Edge Inspectを利用してデバッグ
Introduction to web development 1
Introduction to web development 1
SDUI
1.
SDUI airbnbから学ぶサーバー駆動型UI
2.
従来の方法 Kota Oda Another worksデザイナーインターン
3.
従来の方法 フロント側がサーバーに対して何かしらのデータを要求 サーバーがデーターを渡してレンダリングする
4.
従来の方法 フロント側がサーバーに対して何かしらのデータを要求 サーバーがデーターを渡してレンダリングする Problem web,ios,Androidでそれぞれ固有のロジックをもっている さらにそれは複雑になっていき、それぞれのクライアントで乖離が生まれてしまう 01 アプリの場合バージョンアップするまで実際のユーザーの感触がわからない 02
5.
SDUIとは
6.
SDUIとは airbnbが開発したサーバー駆動型システム airbnbアプリの2つの側面である「ゲスト」と「ホスト」の機能に主眼を置いているため、 Guest+HostからGhost Platformという名称が付いている
7.
SDUIの概念
8.
SDUIの概念 Screen view Section view Action
view
9.
SDUIの概念 Screen view GPは任意の数のスクリーンを持つことができる 画面のレイアウトや、どこにセクションを表示するかを 定義する セクションをどのようにレンダリングするか (ポップオーバー、モーダル、フルスクリーンなど) もscreen viewで定義する
10.
SDUIの概念 Section view UIコンポーネントのまとまったグループのデータを記述するもので 表示されるべき正確なデータが含まれている 他のセクションや表示されている画面から完全に独立している ビジネスロジックと特定の機能との関係を気にすることなく セクションを再利用、再構築することができる
11.
SDUIの概念 Action view ボタンをタップしたりカードをスワイプしたりといったユーザーが画面上の UIを操作する際のアクションを定義できる 機能固有のビジネスロジックを好きなだけ含むことができ、 特定のユースケースが発生したときにカスタムアクションやビジネスロジック を自由に使用することができます
12.
SDUIの特徴
13.
SDUIの特徴 バックエンドがデータと そのデータの表示方法を管理 01 Web、iOS、Androidアプリ全体で 単一のバックエンドのレスポンスによって制御 02
14.
Ghost Platform
15.
考察 サーバーでリリースすることで、web,Appのリリースをしなくて良くなる。 導入すると開発効率が上がる
16.
考察 Another worksのプロダクト開発に合っているのか。 自社のデザインシステムを変更する必要があるのか。 サーバーでリリースすることで、web,Appのリリースをしなくて良くなる。 導入すると開発効率が上がる But 01 02
Download now