Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content
を極める
2014/6/22 (日) 第35回 コンなご勉強会
@ ベースキャンプ名古屋
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
紹介
Katz (上野勝之)
コンクリートファイブジャパン株式会社
取締役 Chief Communications Officer
TW: @katzue...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
コンなご
concrete5 名古屋 ユーザーグループ
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
コンなご
concrete5 名古屋 ユーザーグループ
● 直近イベントの紹介
o オープンソースカンファレンス名古屋
o 7/5 (土) @ 名古屋国際セ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
コンなご
concrete5 名古屋 ユーザーグループ
● 定期イベントについて
o concrete5 の日
 自習 @ ベースキャンプ名古屋
 だい...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
● 参加方法
o Doorkeeper
 次回告知・参加表明は下記コミュニティーに
 concrete5nagoya.doorkeeper.jp
o F...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
本日のアジェンダ
● 20分:デモ環境の確認&自己紹介
● 10分:Designer Content の紹介
● 60分:ワークショップ:デモサイトで実際に...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
本日のアジェンダ
● 20分:デモ環境の確認&自己紹介 [まずは!]
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
今日の内容
Designer Content について
「concrete5 公式活用ガイド
ブック」にも書いてありま
す!
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● concrete5 で、PHP の知識がなくてもオリ
ジナルブロックを作成できるパッケージ
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 定型的な表現をしたい場合に最適
● 例)著作ブロック
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 例)著作ブロック
● 編集画面→
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 例)著作ブロック
● 編集画面→
● テキストフィールドで入力
するので、記事ブロックで
わざわざレイアウトを調...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 他に考えられる用途
o 見出し専用ブロック
o レストランメニュー
o 製品紹介
o 定型レイアウト
o (勉強...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● ブロック作成はHTML + CSS の知識は必要
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・
● ブロック作成はHTML + CSS の知識は必要
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● ブロック作成はHTML + CSS の知識は必要
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● ブロック作成はHTML + CSS の知識は必要
レイアウト調整のために、<div> や ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 場合によってはPHP初級の知識が
必要な場合も
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 場合によってはPHP初級の知識が
必要な場合も
o セレクトボックスを使う場合
o 条件(...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 場合によってはPHP初級の知識が
必要な場合も
o → というか
PHPの初級レベルの知識...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● デモ:PHP初級レベルがあって、作った時
● 「セレクトボックス」
o ちょっと公開できません〜( ̄ー ̄)ニヤリ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 一旦作ると構造を修正できない!
o 修正したい場合...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 一旦作ると構造を修正できない!
o 修正したい場合...
 1. 最初から作り直し
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 一旦作ると構造を修正できない!
o 修正したい場合...
 1. 最初から作り直し
 ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 一旦作ると構造を修正できない!
o 修正したい場合...
 1. 最初から作り直し
 ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 一旦作ると構造を修正できない!
o 修正したい場合...
 1. 最初から作り直し
 ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 1要素 = 1ブロックなので、繰り返すコンテ
ンツは出来ない
o 例:スライドショー
o ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 便利だけど・・・
● 1要素 = 1ブロックなので、繰り返すコンテ
ンツは出来ない
o 例:スライドショー
o ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content とは
● 注意!使わなくなった時
● アンインストールちゃんとやろう!
o きちんと concrete5 のシステムからア...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
DC (Designer Content) の基本
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
DC (Designer Content) の基本
● 仕組みを理解する
o STEP 1: 管理画面でブロックを作成
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
DC (Designer Content) の基本
● 仕組みを理解する
o STEP 1: 管理画面でブロックを作成
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
DC (Designer Content) の基本
● 仕組みを理解する
o STEP 2 (自動): /blocks/ にブロックが追加される
o STE...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
DC: 実際にやってみようぜ
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
DC: 実際にやってみようぜ
● 「concrete5 公式活用ガイドブック」
サンプルデータを使います
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
DC: 実際にやってみようぜ
● 「concrete5 公式活用ガイドブック」
サンプルデータを使います
o STEP 0: データを設定
 book.c...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
DC: 実際にやってみようぜ
● 「concrete5 公式活用ガイドブック」
サンプルデータを使います
o STEP1: 既存のデモ用ブロック「ランチメニ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
DC: 実際にやってみようぜ
● 「concrete5 公式活用ガイドブック」
サンプルデータを使います
o STEP2: 自分で作ってみよう!
 コーデ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
おつかれさまでした〜:15分休憩
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro の紹介
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● Designer Content のプロ版
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● Designer Content のプロ版
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● Designer Content のプロ版
o http://www.concrete5.org/mar...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● Designer Content のプロ版
o http://www.concrete5.org/mar...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● Designer Content のプロ版
o http://www.concrete5.org/mar...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● Designer Content のプロ版
o http://www.concrete5.org/mar...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● DCP の使える用途
o 要素が繰り返されるもの
 構造が複雑なスライドショー
 レストランのメニュ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● DCP の使える用途
o デモ
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● DCP の注意 (DC と比べると)
o 作られるデータの場所に注意
 2箇所でファイルが作られる
●...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● DCP の注意 (DC と比べると)
o view.php の編集が必要
 DC は管理画面で vie...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● DCP の注意 (DC と比べると)
o view.php の編集が必要
 DC は管理画面で vie...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
Designer Content Pro とは
● DCP の使える用途
o 詳しくは Hissy の説明を
 Designer Content Proア...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
一回ゼロから作ってみる?
DC or DCP
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
ゼロから作ってみよう
● 身近な事例で作ってみよう
o 設計
 要素
 DC or DCP?
o コーディング
o 実装
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
ゼロから作ってみよう
● Thinking time!
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
おつカレー様でした
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
今日の内容
Designer Content について
「concrete5 公式活用ガイド
ブック」にも書いてありま
す!
(DCP は Hissy のブ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
次回:会員サイトを作ろう
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
会員サイトを作ろう
● 範囲が広すぎるので、次回の会員サイトの
テーマと仕様を決めたい
o 会社の製品サポートサイト?
o イントラサイト?
o コミュニテ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
コンなご
concrete5 名古屋 ユーザーグループ
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
コンなご
concrete5 名古屋 ユーザーグループ
● 直近イベントの紹介
o オープンソースカンファレンス名古屋
o 7/5 (土) @ 名古屋国際セ...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
コンなご
concrete5 名古屋 ユーザーグループ
● 定期イベントについて
o concrete5 の日
 自習 @ ベースキャンプ名古屋
 だい...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
● 参加方法
o Doorkeeper
 次回告知・参加表明は下記コミュニティーに
 concrete5nagoya.doorkeeper.jp
o F...
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
おわり:おつカレー
2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」
紹介
Katz (上野勝之)
コンクリートファイブジャパン株式会社
取締役 Chief Communications Officer
TW: @katzue...
Upcoming SlideShare
Loading in …5
×

concrete5 の超便利アドオン Designer Content を極める!

4,367 views

Published on

concrete5 CMS での必須アドオン Designer Content の実践セミナーと Designer Content Pro のちょっとの解説。

2014/6/22 (日) に開催された第35回 コンなご (concrete5 名古屋ユーザーグループ) 勉強会のセミナー資料です。

Published in: Design
  • Be the first to comment

concrete5 の超便利アドオン Designer Content を極める!

  1. 1. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content を極める 2014/6/22 (日) 第35回 コンなご勉強会 @ ベースキャンプ名古屋
  2. 2. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 紹介 Katz (上野勝之) コンクリートファイブジャパン株式会社 取締役 Chief Communications Officer TW: @katzueno Blog: ja.katzueno.com
  3. 3. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 コンなご concrete5 名古屋 ユーザーグループ
  4. 4. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 コンなご concrete5 名古屋 ユーザーグループ ● 直近イベントの紹介 o オープンソースカンファレンス名古屋 o 7/5 (土) @ 名古屋国際センター  セミナー @ 10時  ブース展示 10〜18時  詳細はこちら  ブースの手伝いも募集
  5. 5. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 コンなご concrete5 名古屋 ユーザーグループ ● 定期イベントについて o concrete5 の日  自習 @ ベースキャンプ名古屋  だいたい毎月第2水曜日(?)  次回: 2014/7/16 (水) 今回は第3水曜日 o 勉強会  セミナー形式 @ ベースキャンプ名古屋  だいたい第4土曜日(?)  次回:2014/7/26 (土)「会員サイトを作ろう」
  6. 6. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 ● 参加方法 o Doorkeeper  次回告知・参加表明は下記コミュニティーに  concrete5nagoya.doorkeeper.jp o Facebook Group  勉強会までのいろんな議論はこちらに  facebook.com/groups/concrete5nagoya/ コンなご concrete5 名古屋 ユーザーグループ
  7. 7. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 本日のアジェンダ ● 20分:デモ環境の確認&自己紹介 ● 10分:Designer Content の紹介 ● 60分:ワークショップ:デモサイトで実際に制作 ● 10分:Designer Content Pro の紹介 ● 60分:ワークショップ:ゼロから作ろう! ● 30分:次回の会員サイトについて
  8. 8. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 本日のアジェンダ ● 20分:デモ環境の確認&自己紹介 [まずは!]
  9. 9. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 今日の内容 Designer Content について 「concrete5 公式活用ガイド ブック」にも書いてありま す!
  10. 10. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● concrete5 で、PHP の知識がなくてもオリ ジナルブロックを作成できるパッケージ
  11. 11. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 定型的な表現をしたい場合に最適 ● 例)著作ブロック
  12. 12. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 例)著作ブロック ● 編集画面→
  13. 13. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 例)著作ブロック ● 編集画面→ ● テキストフィールドで入力 するので、記事ブロックで わざわざレイアウトを調整 する必要がない!
  14. 14. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 他に考えられる用途 o 見出し専用ブロック o レストランメニュー o 製品紹介 o 定型レイアウト o (勉強会参加者だけに実際のブロックを披露)
  15. 15. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● ブロック作成はHTML + CSS の知識は必要
  16. 16. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・ ● ブロック作成はHTML + CSS の知識は必要
  17. 17. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● ブロック作成はHTML + CSS の知識は必要
  18. 18. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● ブロック作成はHTML + CSS の知識は必要 レイアウト調整のために、<div> や class を使っ て囲んだりする必要があるので、それが分かる 知識が必要。コーディングが出来る友だちをつ くろう!
  19. 19. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 場合によってはPHP初級の知識が 必要な場合も
  20. 20. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 場合によってはPHP初級の知識が 必要な場合も o セレクトボックスを使う場合 o 条件(例:画像がなかった場合)で表現を変えたい 場合
  21. 21. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 場合によってはPHP初級の知識が 必要な場合も o → というか PHPの初級レベルの知識が あると最強!
  22. 22. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● デモ:PHP初級レベルがあって、作った時 ● 「セレクトボックス」 o ちょっと公開できません〜( ̄ー ̄)ニヤリ o 画像と画像キャプション、テキストの回りこみを綺 麗にするブロックです o 選択項目で、画像を左や右に回りこませれます
  23. 23. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 一旦作ると構造を修正できない! o 修正したい場合...
  24. 24. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 一旦作ると構造を修正できない! o 修正したい場合...  1. 最初から作り直し
  25. 25. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 一旦作ると構造を修正できない! o 修正したい場合...  1. 最初から作り直し  2. 直接コードを書き直し ● デザインやコーディングの修正:FTPで直接行う ● それ以外:PHP 中級と concrete5 ブロック開発の知識が必 要
  26. 26. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 一旦作ると構造を修正できない! o 修正したい場合...  1. 最初から作り直し  2. 直接コードを書き直し ● デザインやコーディングの修正:FTPで直接行う ● それ以外:PHP 中級と concrete5 ブロック開発の知識が必 要 まあ、view.php の CSS とかHTML 修正をするのは簡単なので・・・。
  27. 27. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 一旦作ると構造を修正できない! o 修正したい場合...  1. 最初から作り直し  2. 直接コードを書き直し ● デザインやコーディングの修正:FTPで直接行う ● それ以外:PHP 中級と concrete5 ブロック開発の知識が必 要 まあ、view.php の CSS とかHTML 修正をするのは簡単なので・・・。 まあ、なんとかなるべ
  28. 28. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 1要素 = 1ブロックなので、繰り返すコンテ ンツは出来ない o 例:スライドショー o 例:レストラン価格表(リスト一覧)
  29. 29. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 便利だけど・・・ ● 1要素 = 1ブロックなので、繰り返すコンテ ンツは出来ない o 例:スライドショー o 例:レストラン価格表(リスト一覧) DCP があるよ ( ̄ー ̄)ニヤリ 詳しくは後述
  30. 30. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content とは ● 注意!使わなくなった時 ● アンインストールちゃんとやろう! o きちんと concrete5 のシステムからアンインストー ルしよう o 場所:管理画面 - ブロックタイプ - 作ったブロック - 削除 o それから FTP でファイルを削除!
  31. 31. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 DC (Designer Content) の基本
  32. 32. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 DC (Designer Content) の基本 ● 仕組みを理解する o STEP 1: 管理画面でブロックを作成
  33. 33. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 DC (Designer Content) の基本 ● 仕組みを理解する o STEP 1: 管理画面でブロックを作成
  34. 34. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 DC (Designer Content) の基本 ● 仕組みを理解する o STEP 2 (自動): /blocks/ にブロックが追加される o STEP 3: あとは他のブロックと同じように追加・編 集ができる
  35. 35. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 DC: 実際にやってみようぜ
  36. 36. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 DC: 実際にやってみようぜ ● 「concrete5 公式活用ガイドブック」 サンプルデータを使います
  37. 37. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 DC: 実際にやってみようぜ ● 「concrete5 公式活用ガイドブック」 サンプルデータを使います o STEP 0: データを設定  book.concrete5-japan.org からダウンロード  ダウンロードページにある YouTube動画にした がってテストサイトを実装  Designer Content をインストール o 勉強会参加者はデータを提供
  38. 38. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 DC: 実際にやってみようぜ ● 「concrete5 公式活用ガイドブック」 サンプルデータを使います o STEP1: 既存のデモ用ブロック「ランチメニュー 用」DCブロックを試してみよう
  39. 39. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 DC: 実際にやってみようぜ ● 「concrete5 公式活用ガイドブック」 サンプルデータを使います o STEP2: 自分で作ってみよう!  コーディングサンプルから「ランチメニュー 用」ブロックを自分で作成して見よう  [/mockup/lunch.html] の81-91行目を DC ブロッ クに当てはめてみよう!
  40. 40. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 おつかれさまでした〜:15分休憩
  41. 41. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro の紹介
  42. 42. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● Designer Content のプロ版
  43. 43. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● Designer Content のプロ版
  44. 44. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● Designer Content のプロ版 o http://www.concrete5.org/marketplace/addons/desig ner-content-pro/
  45. 45. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● Designer Content のプロ版 o http://www.concrete5.org/marketplace/addons/desig ner-content-pro/ o $50 の有料ブロック
  46. 46. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● Designer Content のプロ版 o http://www.concrete5.org/marketplace/addons/desig ner-content-pro/ o $50 の有料ブロック o 繰り返しコンテンツに最適
  47. 47. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● Designer Content のプロ版 o http://www.concrete5.org/marketplace/addons/desig ner-content-pro/ o $50 の有料ブロック o 繰り返しコンテンツに最適 o あとから構造の修正編集ができる!
  48. 48. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● DCP の使える用途 o 要素が繰り返されるもの  構造が複雑なスライドショー  レストランのメニュー価格表  製品・サービスの仕様表  リンクリスト
  49. 49. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● DCP の使える用途 o デモ
  50. 50. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● DCP の注意 (DC と比べると) o 作られるデータの場所に注意  2箇所でファイルが作られる ● /blocks/ ● /packages/designer_content_pro_blocks/blocks/ o ファイルをバックアップする時は、Package フォルダの ファイルも忘れずに!
  51. 51. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● DCP の注意 (DC と比べると) o view.php の編集が必要  DC は管理画面で view.php をある程度作成可能  ただし DCP は view.php をゼロから設計が必要  HTML+CSS の知識は必要
  52. 52. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● DCP の注意 (DC と比べると) o view.php の編集が必要  DC は管理画面で view.php をある程度作成可能  ただし DCP は view.php をゼロから設計が必要  HTML+CSS の知識は必要 でも、マスターすると ハマるよ!
  53. 53. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 Designer Content Pro とは ● DCP の使える用途 o 詳しくは Hissy の説明を  Designer Content Proアドオンの紹介  Designer Content Pro フロントエンドAPI 邦訳  Designer Content Proで作るナビゲーションブ ロック
  54. 54. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 一回ゼロから作ってみる? DC or DCP
  55. 55. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 ゼロから作ってみよう ● 身近な事例で作ってみよう o 設計  要素  DC or DCP? o コーディング o 実装
  56. 56. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 ゼロから作ってみよう ● Thinking time!
  57. 57. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 おつカレー様でした
  58. 58. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 今日の内容 Designer Content について 「concrete5 公式活用ガイド ブック」にも書いてありま す! (DCP は Hissy のブログ記事 参照)
  59. 59. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 次回:会員サイトを作ろう
  60. 60. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 会員サイトを作ろう ● 範囲が広すぎるので、次回の会員サイトの テーマと仕様を決めたい o 会社の製品サポートサイト? o イントラサイト? o コミュニティサイト?
  61. 61. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 コンなご concrete5 名古屋 ユーザーグループ
  62. 62. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 コンなご concrete5 名古屋 ユーザーグループ ● 直近イベントの紹介 o オープンソースカンファレンス名古屋 o 7/5 (土) @ 名古屋国際センター  セミナー @ 10時  ブース展示 10〜18時  詳細はこちら  ブースの手伝いも募集
  63. 63. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 コンなご concrete5 名古屋 ユーザーグループ ● 定期イベントについて o concrete5 の日  自習 @ ベースキャンプ名古屋  だいたい毎月第2水曜日(?)  次回: 2014/7/16 (水) 今回は第3水曜日 o 勉強会  セミナー形式 @ ベースキャンプ名古屋  だいたい第4土曜日(?)  次回:2014/7/26 (土)「会員サイトを作ろう」
  64. 64. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 ● 参加方法 o Doorkeeper  次回告知・参加表明は下記コミュニティーに  concrete5nagoya.doorkeeper.jp o Facebook Group  勉強会までのいろんな議論はこちらに  facebook.com/groups/concrete5nagoya/ コンなご concrete5 名古屋 ユーザーグループ
  65. 65. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 おわり:おつカレー
  66. 66. 2014.6.22 (日) 第35回 コンなご勉強会 「デザイナーコンテンツを極める」 紹介 Katz (上野勝之) コンクリートファイブジャパン株式会社 取締役 Chief Communications Officer TW: @katzueno Blog: ja.katzueno.com

×