SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

特集記事(AD)

アイデアをどこでも形に!Dreamweaver+Proto連携
~Adobe Creative Cloudの上手な活用法

  • このエントリーをはてなブックマークに追加

Adobe Protoを使ったワイヤーフレームの作成(2)コンポーネントを使う

 ストロークジェスチャーを使うだけでなく、用意されたコンポーネントを使うこともできます。コンポーネントを使う場合には、タップしてドラッグするほか、タップのみでアイテムを挿入することも可能です。

Text テキスト
Div div要素
Image 画像
Video ビデオ
Field フォームの部品
Widget ウィジェット

 Text、Field、Widgetにはサブツールが隠されています。Textには次のコンポーネントがあります。

Text Heading 見出し
Para Text 段落テキスト

 Fieldには次のコンポーネントがあります。

Text Field フォームのテキストフィールド
Text Area フォームのテキスト領域
Button フォームのボタン
Dropdown フォームのドロップダウンメニュー
Radio Button フォームのラジオボタン
Check Box フォームのチェックボックス

 Widgetには次のコンポーネントがあります。

Breadcrumbs パンくずリスト
Navigation Bar 横並びのナビゲーションバー
Verical Menu Bar 縦並びのナビゲーションバー
Accordion Menu アコーディオンメニュー(開閉式)
Tab Bar タブバー

次のページ
Adobe Protoを使ったワイヤーフレームの作成(3)挿入アイテムを編集する

この記事は参考になりましたか?

  • このエントリーをはてなブックマークに追加
特集記事連載記事一覧

もっと読む

この記事の著者

鷹野 雅弘(タカノ マサヒロ)

 株式会社スイッチ Webサイトの構築やコンサルティングを中心に、WebやDTPに関しての講演やトレーニングのほか、書籍の企画や編集、スクールなどのカリキュラム開発も手がける。 2005年からCSS Niteを主宰。日本全国、および海外に展開し、260回を超える関連イベントを通し、のべ36,000名を超える方が参加している。 テクニカルライターとして20冊以上の著書を持ち、総販売数は14万部を超える。主な著書に『よくわかるDreamweaverの教科書』(共著、マイナビ)、企画編集を行った書籍に『現場のプロから学ぶXHTML+CSS』(マイナビ)など。

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

【AD】本記事の内容は記事掲載開始時点のものです 企画・制作 株式会社翔泳社

この記事は参考になりましたか?

この記事をシェア

  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/6721 2013/01/15 17:33

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング