お客さまがご利用のブラウザはサポートされていないため、正常に利用できない可能性があります。 お手数ですが、こちらをご確認いただき推奨環境のブラウザをインストールしてご利用ください。

Bootstrapで超高速らくらく レスポンシブ・グリッドシステム

対面

生明義秀が解説する、大人気・大定番のBootstrapを使ってレスポンシブウェブデザインのグリッドレイアウトを素早く簡単に設置する講座。

こんなことを学びます

レスポンシブウェブデザインのフレキシブルなグリッドシステムを高速で作成可能にする、フロントエンドフレームワークの国際的デファクトスタンダード、Bootstrap。
Bootstrapを導入すれば、瞬く間に高機能なレスポンシブウェブデザインを作成できます。

Bootstrap オフィシャルサイト
https://getbootstrap.com

この講座では、Bootstrapの『レイアウト (Layout)』機能に特化し、

● Bootstrap オフィシャルサイトの読み方

● Bootstrapの入手方法

● Bootstrapのセッティング

● レイアウト設定の基本
● グリッドシステムの仕組み
● レイアウトに関連するCSSユーティリティ
をハイブリッド・ハンズオンで解説します。

■ フロントエンドフレームワークとは
Bootstrapに代表されるフロントエンドフレームワーク(CSSフレームワーク)とは、よく調整された高度なCSSのデザインセットやJabaScriptの機能が予め用意されたライブラリ集です。
Bootstrapを用いれば、基礎工程が終わった状態からウェブデザイン作業を始めることができ、時間や労力を大きく削減することができます。
もちろん、オリジナルのビジュアルデザインを上載せして、オリジナリティーのあるウェブデザインを制作することも可能です。

Bootstrap 使用事例 - Responsive Web Design JP
http://responsive-jp.com/category/technique/bootstrap

■ Bootstrapとは
Bootstrapは数あるフロントエンドフレームワークのなかで、人気No. 1の大定番。
かつてはTwitter社内で作られ、Twitter Bootstrapと呼ばれていました。
2011年の誕生以来、世界中で愛用されています。
MIT License で商用利用も可能で、もちろん無料です。

Bootstrapの扉を開いて、賽の河原の子供たちやシーシュポスのような仕事の在り方から、一日も早く脱却してください。

● 当講座で学べること
○ Bootstrapの概要
○ Bootstrapの入手・導入方法
○ Bootstrapのレイアウトの基本と方法
○ Bootstrapのグリッドシステムによるレスポンシブウェブデザインの機能
○ Bootstrapのレイアウトに関連するCSSの各種ユーティリティの紹介

● 当講座で得られること
○ ウェブデザインのノーマライズCSSに代わる高機能な基礎ライブラリ(フレームワーク)
○ 超高速なウェブデザイン作業を実現するためのソースと方法
○ ウェブ制作の作業効率の大幅な向上とコスト削減
○ 競合他社への競争力 など
※ 学習教材や資料がある場合は、お持ち帰りいただけます。

※ 講座内で利用するデモなどのサンプルファイルがある場合は、ダウンロード可能です。
※ 各種受講証明書への署名・発行に対応します。

● 当講座の特徴
○ ハンズオン講座ながら、手ぶらの座学受講も可能なハイブリッド・ハンズオン形式です。
○ 実践的な知識や方法を、要点をまとめて、わかりやすく解説します。
○ 操作の解説は、デモンストレーションで実演して解説します。
○ 講義後に、質疑応答の時間を設けます。

● 協賛企業・ブランド
Bitsmith株式会社
https://bitsmith.world

#bauya14
続きを読む

開催日程がありません

開催予定エリア

六本木・赤坂

価格(税込)

¥3,800

受けたい
41人が受けたい登録しています

対面受講日程

開催日程はありません。開催リクエストを送ってみましょう。

価格(税込) ¥3,800
場所 六本木・赤坂

この講座の先生

生明 義秀のプロフィール写真
アートディレクター,ウェブクリエイター,講師

生明 義秀

アートディレクター,グラフィックデザイナー,ウェブクリエイター,クリエイティブコンサルタント,講師。 

ブランディングやSP広告などのグラフィックデザイン、ウェブサイト制作、UI/UXデザイン、動画編集、eラーニングのオーサリングなど多数のクリエイションに従事。 

広告戦略や制作システムに関するコンサルテーションも行い、さまざまな企業の研修にプランナー・アドバイザーとして招請されている。 

最新技術の啓蒙や後進の育成に尽力し専門学校などの教育機関で講師を務めるほか、Adobe MAXなどの大規模イベントをはじめ、宣伝会議やデジタルハリウッドなどの専門講座にも多数登壇。 

SBテクノロジー株式会社と共同で、定期開催のデザインに関するトークイベント『FONTPLUS DAYセミナー』を企画運営している。 

AZM Design 代表 
Bau-ya™ プロデューサー 
学校法人専門学校 東洋美術学校 講師 
公益社団法人 日本グラフィックデザイナー協会(JAGDA) 正会員 

Twitter
https://twitter.com/g_azami 

Facebook
https://www.facebook.com/gishuazami

この講座の主催団体

クリエイターの学び舎 Bau-ya

プロとプロを目指すクリエイターの学び舎、Bau-ya™(バウヤ)。
アートやデザイン、ITやウェブなどの、トップクリエイターや著名講師らの『いま、伝えたいこと』を、そのまま講座にして催します。


■ Bau-yaが招聘する実力派講師陣

業界の最前線で活躍している、実績や経験が豊富な著名クリエイターを招聘。
人気書籍の執筆者や、有名スクールの講師としてお馴染みの面々も登壇します。
現場主義やベテランだからこそ聴ける情報が満載です。


■ Bau-yaにある『知識講座』『技術講座』『ワークショップ講座』の3つのスタイル

『知識講座』は、ふんだんな資料や図解で解説する座学形式。
業界人として必須の教養や情報を学べます。
スライドや資料などを見ながら、じっくり学ぶスタイル。
提示されるスライドや資料はダウンロードして、何度でも復習いただけます。

『技術講座』は、ふんだんに実演デモを駆使するハイブリッド・ハンズオン形式。
制作の現場で必須のテクニックを学べます。
一緒に実習しながらでも、または聴講のみでも、どちらでも参加できるスタイル。
使...
もっと見る >>

主催団体に質問する 教室ページをみる
  • 当日の流れとタイムスケジュール

    ■ 開場時間
    開演15分前から

    ■ 所要時間
    約1.5 - 2時間程度(途中参加、途中退出も可能です)

    ■ 講座の流れ(予定)
    1. オープニング(BAU-YAおよび講座について説明,登壇者紹介など 約5分)
    2. 講義(約35 - 50分)
    3. 休憩(約5分)
    4. 講義(約35 - 50分)
    5. 質疑応答(約5分)
    6. エンディング(約5分)
    ※ 講義時間や時間割は、変更する可能性があります。
    ※ 予定よりも早く終了、または長引く可能性があります。
    • こんな方を対象としています

      □ ウェブ制作関連職の方
      
□ ウェブデザイン学習者の方

      □ 超高速なウェブデザインを求められている方
      
□ ウェブデザインの作業効率とコスト削減を求めている方

      □ 毎回ゼロからウェブデザインの作業をすることに疲れ果てている方
    • 受講する際は以下をお読み下さい

      ■ ご持参いただくもの
      
□ ハンズオン受講の方は、コンピュータをご持参ください。
      
  ※ 座学受講での参加も可能です。
      
□ Visual Studio Code、Atom、Adobe Brackets、Adobe Dreamweaverなど、ご自身が使い慣れたソースコードエディタやウェブオーサリングツール
      
  ※ コンピュータの動作やソフトウェアなどの動作不良に関するサポートは行いません。
      
□ メモを取るための筆記用具やデバイスはご持参ください。
      


      ■ その他
      
□ 講義中の録音などの一切の収録行為を禁じています。

      
□ 講座内で配布する資料やファイルなどの一切の再配布を禁じています。
      □ お名刺をお持ちでしたら、講座終了後に、登壇者や主宰者とご交換ください。
    ※ストアカでは講座に適用される保険を用意しています。詳しくはストアカ補償制度をご覧ください。

    レビュー6

    • 楽しかった!( 4 )
    • 勉強になった!( 4 )
    • 行く価値あり!( 5 )
  • W1

    女性

    この講座は「Bootstrapを効率的に学ぶことができる講座」でした

    リファレンスの見方をとおして、Bootstrapの利用法を効率的に学ぶ事ができました。
    仕事上、引き継いだコードにある記述を最低限の範囲で使っておりましたが、今日の参加により、自分でも色々と応用したいと思えるようになりました。一人では、なかなか理解を進められなかったので、参加できてとても良かったと思いました。

  • M2

    男性 40代

    この講座は「最新のレイアウト把握に最適な講座」でした

    本来デファクトスタンダードであり、知ってなくてなならい内容の再確認が出来る講座です。
    知っている人は再確認に最適ですし、知らない方は一刻も早く受講して習得しなくてはならない内容であると思います。

  • M1

    男性 30代

    この講座は「ムキムキ講座」でした

    WEBデザイナーのためのジム!!まさにそんな感じの講座でした。

    ・とにかく復習がしやすい
    復習しやすい講義内容がとても良いです!短い時間なのでスキルを定着させるには復習が重要。復習のことまで考えられた講義内容は素晴らしい!!

    ・講師の知識が豊富
    設置されているプロジェクターのLED話からはじまり、グラフィックデザインの歴史など、知識が豊富なので話がとても面白い!もちろん、最先端の情報も山ほど聞けます!!

    ・プレゼンが上手い
    受講者にあわせた進行スピードの調整、スライドのデザイン、丁寧な説明、雑談でのユーモアなど、わかりやすく、そして心地良く受講できます!!

    と、個人的にはかなり充実している講座でした!
    また、BAUYAという一流講師陣を集めた講座も作られているようなので、
    そちらにも通って、デザイナー筋を鍛えようと思います!

  • W2

    女性 30代

    この講座は「プロ対プロでも新しい発見のある講座」でした

    初心者に分かりやすいように工夫された教材でとっても勉強になりました!教える時気をつけるアウトプットの方法や説明の仕方、初心者が難しいと感じるところは最低限必要なところを説明してくれて無理に押し付けないなどきめ細かい配慮が感じられました。

    これはプロでも学ぶべきことだなと実感できめっちゃめっちゃお得な講座でした!

  • W3

    女性 30代

    この講座は「実践的でわかりやすい講座」でした

    Bootstrap公式サイトの解説と、先生オリジナルの教材でコーディングをしながら進められたので、とても分かりやすかったです。楽しい雰囲気で教えてくださり、Web業界のトレンドなども随所で聞けて、有意義なセミナーでした。
    これから様々な先生が登壇されるようなので、また受講したいと思います!ありがとうございました。

  • この主催団体の他の講座

    54

    開催リクエスト受付中

    六本木・赤坂 / オンライン

    関連講座

    この講座を見た人は、こんな講座も見ています

    お探しの講座が見つかりませんでしたか?