Speaking Design

Workshop

Bootstrap

レスポンシブ仕様のwebサイトがカンタンに作れるBootstrap。
レスポンシブ対応のソースコードを自分で書くのが一番確実ですが、
「Bootstrapで制作されているwebサイトの運営を依頼されたんだけど、どうしよう!」
ということもあると思います。

Bootstrapは、あらかじめレスポンシブデザインの要素が準備されているフレームワークです。
ゼロから自分からソースコードを書く必要がないぶん、細かいところまで自分の思い通りにするのがちょっと大変、という歯がゆさもあります。

本ワークショップでは、そんないいトコ悪いトコ含め、
Bootstrapの基本的な機能をご紹介します。

セミナー、ワークショップ事例

セミナー、ワークショップの内容です。
(目安時間:下記1から3まで、トータルで4〜5時間程度)

  1. Bootstrapについて
    改めてBootstrapとは何か、
    使用すると何のメリットがあるのかをご紹介します。
  2. Bootstrapの基本構成
    Bootstrap内で既に準備されている、レスポンシブデザインに必要な基本的な要素のうち、代表的なものをご紹介していきます。
  3. サイト制作
    2で、学んだコトを組み合わせて、1ページ作ってみましょう。

完成品サンプル

セミナー、ワークショップで制作した作品例です。

スマートフォン用デザイン
スマートフォン用デザイン
パソコン用デザイン
パソコン用デザイン

参加者様のスキル目安

  

    

html&cssのスキル
html&cssで簡単なwebページを作った事のある方。
基本的な知識をお持ちであれば大丈夫です。

    

デザインのスキル
必要ありません。
当日は教材に沿って、みんなで同じ物を完成させます。