SlideShare ist ein Scribd-Unternehmen logo
1 von 13
HTML5
 インタラクテ
      ィブ
    デザイン
デザイナーとデベロッパによる生対談
目次
①   自己紹介
②   サイト紹介
③   デザインができるまで
④   インタラクティブなデザイン
⑤   思考回路の違い
⑥   もっとこうすればよかった!
⑦   まとめ
自己紹介
名前:稲田真帆

職種:デザイナー   ( 現在 js を勉強中! )
今は主にスマホサイトを手がけています。
Html5j のデザインしました。
     .org
会社:株式会社シーエー・モバイル

( 絶賛デベロッパー&デザイナーを募集
中! )
ハマっているもの:塩麹
サイト紹介




サイト名: M OGUT ARO                サイト名:J a nese Cha
                                                pa         lkboard   サイト名: I D B Feed Rea        der
 URL:http://ds-fileapi.qw.to/    URL:http://ds-websocket.qw.to/      URL:http://ds-indexeddb.qw.to/
デザインが
できるまで
インタラクティ
   ブな
 デザイン
思考回路
のちがい
ぶっちゃけトーク
「もっとこうす
   れば
 よかった!」
まとめ
① 作り始める前にある程度のアクシ
ョンの洗い出しと動きの想定しておく
② インタラクティブなデザインを実
現するにはコミュニケーションが不可
欠
③ お互いの領域について、ある程度
の理解は必要

Weitere ähnliche Inhalte

Was ist angesagt?

Was ist angesagt? (16)

グリッドレイアウトを簡単に行うJavaScript!Masonry.js
グリッドレイアウトを簡単に行うJavaScript!Masonry.jsグリッドレイアウトを簡単に行うJavaScript!Masonry.js
グリッドレイアウトを簡単に行うJavaScript!Masonry.js
 
Q(キュー)サイトに学ぶ、 演出のためのHTML5
Q(キュー)サイトに学ぶ、 演出のためのHTML5Q(キュー)サイトに学ぶ、 演出のためのHTML5
Q(キュー)サイトに学ぶ、 演出のためのHTML5
 
声の実体化体験 - HTML5でつくるデジタルインスタレーション -
声の実体化体験 - HTML5でつくるデジタルインスタレーション -声の実体化体験 - HTML5でつくるデジタルインスタレーション -
声の実体化体験 - HTML5でつくるデジタルインスタレーション -
 
レスポンシブ・ウェブデザイン基礎
レスポンシブ・ウェブデザイン基礎レスポンシブ・ウェブデザイン基礎
レスポンシブ・ウェブデザイン基礎
 
知っておきたい「Web制作イマドキの注目ポイント」
知っておきたい「Web制作イマドキの注目ポイント」知っておきたい「Web制作イマドキの注目ポイント」
知っておきたい「Web制作イマドキの注目ポイント」
 
Dreamweaver CS6で作るレスポンシブWebデザイン
Dreamweaver CS6で作るレスポンシブWebデザインDreamweaver CS6で作るレスポンシブWebデザイン
Dreamweaver CS6で作るレスポンシブWebデザイン
 
コーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドラインコーディングを考慮したWebデザインガイドライン
コーディングを考慮したWebデザインガイドライン
 
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しようCSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
 
おいしいherokuの使い方
おいしいherokuの使い方おいしいherokuの使い方
おいしいherokuの使い方
 
ビジュアルエディタ用CSSで 快適なブログライフを!
ビジュアルエディタ用CSSで 快適なブログライフを!ビジュアルエディタ用CSSで 快適なブログライフを!
ビジュアルエディタ用CSSで 快適なブログライフを!
 
レスポンシブ基礎 ~Webサイトをレスポンシブに する方法とそのメリット~
レスポンシブ基礎 ~Webサイトをレスポンシブに する方法とそのメリット~レスポンシブ基礎 ~Webサイトをレスポンシブに する方法とそのメリット~
レスポンシブ基礎 ~Webサイトをレスポンシブに する方法とそのメリット~
 
[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性
[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性
[UXリサーチ共有会] エンジニアからUXデザイナーへキャリアチェンジして気づいたリサーチの重要性
 
ウェブ制作者のためのJimdo活用法
ウェブ制作者のためのJimdo活用法ウェブ制作者のためのJimdo活用法
ウェブ制作者のためのJimdo活用法
 
最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点
最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点
最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点
 
20090410 Idcon Stomita
20090410 Idcon Stomita20090410 Idcon Stomita
20090410 Idcon Stomita
 
WebSig会議 vol.33:2ndセッション「ハートに響くUIを生み出すためのデザインプロセス」
WebSig会議 vol.33:2ndセッション「ハートに響くUIを生み出すためのデザインプロセス」WebSig会議 vol.33:2ndセッション「ハートに響くUIを生み出すためのデザインプロセス」
WebSig会議 vol.33:2ndセッション「ハートに響くUIを生み出すためのデザインプロセス」
 

Html5インタラクティブデザイン