Webデザイン 実践研修パッケージ

公開日:2018/02/01
更新日:2022/09/15
    • 【研修対象者】

      • Webデザイナー
    • 【解決できるお悩み・ニーズ】

      • ・Webデザイナーとしての実践的なスキルを学びたい
      • ・Webデザインの全工程を行えるようになりたい
    • 研修内容

      この研修パッケージでは、Webデザイナーの方を対象として、デザインパターンやレスポンシブコーディングの汎用性の高いWebデザインの基礎スキルについて学ぶことができます。Webデザインの知識はある程度身につけたものの、実践レベルのスキルを身に付けたいとお考えの方におすすめの研修パッケージです。

      特長

      Schoo for Businessでは、Webデザインに関する汎用的なスキルを身につけたい方のために、「デザインパターン基礎」や「レスポンシブコーディング入門」など、幅広い研修動画を提供しています。時間や場所を選ばないオンライン研修だからこそ、効率的にWebデザイナーとして必要なスキルを学習することができます。 例えば、作りたいランディングページのイメージはあるものの具体的にどうデザインしたらいいかわからない、という課題には、「ライブグラフィックデザイン:プロの技から学ぶ」というオンライン研修をご用意しています。 加えて、お客様独自でご用意された動画を研修パッケージに自由に加えたり、受講者一人ひとりに合わせて対象とする研修動画を変えることができるため、個々人のスキルレベルや職種などの関わるビジネスシーンに合わせてピンポイントでWebデザイナーとしての能力を育成することが可能です。

      研修のゴール

      • ・ランディングページを制作するときのポイントと考え方を習得できる
      • ・PCサイトやスマートフォンサイトのデザインパターンとコーディングができる
      • ・MediaQueryを用いたCSSのコーディングができる
  • 研修プログラム

       
      • 「可愛い」テイストのランディングページを、生放送で公開制作

        • ・中学生向けリップクリームのLPデザイン制作における制作に入るまでの思考について
        • ・フォントや背景など、実際の作成風景
      • 「信頼感のある」ランディングページを、生放送で公開制作

        • ・営業代行サービスのリスティング広告用LPのデザイン制作における制作に入るまでの思考について
        • ・フォントや背景など、実際の作成風景
      • 皆さんのご要望にお応えして「アイスクリーム屋さんのECサイトTOP」を生放送で公開制作

        • ・ECサイトのデザイン制作における制作に入るまでの思考について
        • ・写真やロゴの挿入など、実際の作成風景
      • デザインパターン基礎 -Web制作におけるデザインの全体像をつかむ-

        • ・WEB制作におけるデザインの意義
        • ・一般的に言われているデザインと本来のデザインの違いについて
        • ・WEB制作の流れを理解する
        • ・フロントエンドにおけるWEBデザインの意義を学ぼう
        • ・PC・スマートフォンデザインの違いと特徴
        • ・フラットデザイン・マテリアルデザインといった昨今のWEBデザインにおけるトレンド
      • デザインパターン基礎 -CSSのみで実装できるデザインテクニック-

        • ・CSSとHTMLの関係性について
        • ・代表的なプロパティについて
        • ・効果をつけるときに使用するCSSの紹介
        • ・アクションボタンの作成方法
      • デザインパターン基礎 -CSSとjQueryを使ったハンバーガーメニューの実装-

        • ・ハンバーガーボタンのCSS設計とレスポンシブ対応について
        • ・jQueryを導入したボタンの実装と動作確認
      • デザインパターン基礎 -CSSとjQueryを使ったプルダウンの実装-

        • ・プルダウンの構造理解とCSS設計方法
        • ・jQueryを導入したプルダウンの実装と動作確認
      • デザインパターン基礎 -カルーセルスライダーslickを用いたスライドの実装-

        • ・jQueryのプラグインslickについての理解とダウンロード
        • ・slickを用いたスライドの実装
      • デザインパターン基礎 -動作に合わせてデザインを変化させるパララックス(視差効果)の実装-

        • ・パララックス全体の説明
        • ・背景固定の作り方とその際のHTML・CSSの実装
        • ・時間差で降ってくる雪の作り方
        • ・一定のスクロール量で現れる要素の作り方
      • デザインパターン基礎 -スクロール時にTOPを固定させる実装-

        • ・トップ固定の実装の説明とメリット
        • ・jQueryの実装方法の理解
        • ・デザインパターン基礎 -情報量が多い時に役立つ切り替えタブの実装-
      • 切り替えタブの理解と実装について

        • ・切り替えタブにおけるHTML,CSS,jQueryの理解
      • レスポンシブコーディング入門 -MediaQueryを実装する-

        • ・レスポンシブデザインの概要と.htaccessの違いについて
        • ・ブレイクポイントの概要とBootstrapのブレイクポイントについて
        • ・MmediaQueryの実装方法について
      • レスポンシブコーディング入門 -ブレイクポイントを増やす-

        • ・タッチデバイスの幅などデバイスプレビュー
        • ・ブレイクポイント毎のCSS
      • レスポンシブコーディング入門 -ブレイクポイントごとのCSS完成-

        • ・仕上げのCSSの記載方法
        • ・崩れたUIの修正方法
        • ・実機での検証について
  • 受講者の評価

    評価

    4.1/5.0

    • 受講者コメント

      とても分かりやすいです。今までCSSを中途半端に理解したままでした。CSSの意味(個性)を知ることで理解を深めることができました。ありがとございます。

    研修概要

    時間

    15時間30分(90分×3コマ+60分×11コマ)

    料金

    1,500円 / ID(最少20ID~)

    ※定額制で全ての動画が受け放題

    ※ボリュームディスカウントあり

    開催場所

    WEB

    ※オンライン受講のみのサービスです

  • 関連する研修カリキュラム

  • よくあるご質問

    • 1. 資料請求/お問い合わせ
       お問い合わせ後、弊社担当よりご連絡いたします。ご利用用途や対象者などをお教えください。
      2. ヒアリング/運用イメージのご提案
       現在の研修状況や計画などをヒアリングし、最適な研修内容のご提案とお見積もりをいたします。
      3.ご契約
       お申し込みいただきご契約となります。
    • 20IDからご契約が可能です。
      料金についてはご契約のID数によって異なりますので、お気軽にお問い合わせください。
    • 国内最大級となる7,000本以上の動画数でビジネススキルから政治・経済・金融・デザイン、プログラミング、 DX、AIまで全21カテゴリの幅広い領域を網羅しています。 社員研修から自律学習まで幅広くご活用いただけます。
      また年間600本の動画が更新されるので、最新のトレンドや環境に合わせた研修や学習が可能です。
    • Schoo for Businessは法人でご契約いただき、各社員に視聴権限(ID)を割り振って受講いただくプランです。
      一方、プレミアムプランは個人でご契約いただく有料のプランです。
      そのため、管理機能・研修機能はSchoo for Business(法人でのご契約)のみでご利用いただくことが可能です。

20万人のビジネスマンに支持された楽しく学べるeラーニングSchoo(スクー)
資料では管理機能や動画コンテンツ一覧、導入事例、ご利用料金などをご紹介しております。
デモアカウントの発行も行っておりますので、お気軽にお問い合わせください。

お電話でもお気軽にお問い合わせください受付時間:平日10:00〜19:00

03-6416-1614

03-6416-1614

法人向けサービストップ