wan55camp 受講者専用 学習動画一覧
◆ 1.はじめに ◆
wan55camp概要
01-01.Wan55camp概要
◆ 2.事前に必要となる知識(win) ◆
PC操作基礎(windows編)
02-01-01.事前に必要になるパソコンの知識〜マウスの操作
02-01-02.ファイル・フォルダの操作(windows)
02-01-03.基本的なショートカット(windows)
02-01-04.文字入力の切り替え(windows)
02-01-05.ファイルのダウンロード(windows)
02-01-06.圧縮ファイルの展開(windows)
02-01-07.アプリケーションのインストール(windows)
◆ 2.事前に必要となる知識(mac) ◆
PC操作基礎(mac編)
02-01-01.事前に必要になるパソコンの知識〜マウスの操作
02-01-02.ファイル・フォルダの操作(mac)
02-01-03.基本的なショートカット(mac)
02-01-04.文字入力の切り替え(mac)
02-01-05.ファイルのダウンロード(mac)
02-01-06.圧縮ファイルの展開(mac)
02-01-07.アプリケーションのインストール(mac)
◆ 3.制作環境の準備(win) ◆
制作に必要な環境の準備(windows編)
03-01-01.必要アプリケーションの確認とインストール(windows)
03-01-02.chromeの設定
03-01-03.Slackの設定・使用方法
03-01-04.Zoomの設定
◆ 3.制作環境の準備(mac) ◆
制作に必要な環境の準備(mac編)
03-01-01.必要アプリケーションの確認とインストール(mac)
03-01-02.chromeの設定
03-01-03.Slackの設定・使用方法
03-01-04.Zoomの設定
◆ 4.ウェブリテラシー(win) ◆
制作に必要なリテラシー(windows編)
04-01-01.Web全般の基礎知識1
04-01-02.Web全般の基礎知識2
04-02-01.ドメイン基礎
04-03-01.拡張子・隠しファイル(windows)
◆ 4.ウェブリテラシー(mac) ◆
制作に必要なリテラシー(mac編)
04-01-01.Web全般の基礎知識1
04-01-02.Web全般の基礎知識2
04-02-01.ドメイン基礎
04-03-01.拡張子・隠しファイル(mac)
◆ 5.コーディング基礎 -1.HTML基礎 ◆
コーディングに必要なHTML基礎
05-02-18背景画像の表示サイズ background-sizeプロパティ
05-01-01.Webサイト・HTMLとは
05-01-02.HTMLの書き方(タグ・要素)
05-01-03.HTMLの書き方(属性)
05-01-04.HTMLの基本構造
05-01-05.使用頻度の高い基本的な要素
05-01-06.見出し(h1〜h6)
05-01-07.段落と改行と罫線(p・br・hr)
05-01-08.リストに関連する要素(ul・ol・li)
05-01-09.説明(定義)リストに関連する要素(dl・dt・dd)
05-01-10.画像(img)
05-01-11.パスの指定方法
05-01-12.リンク要素(a)
05-01-13.表組要素(table)
05-01-14.HTML基礎 まとめ課題
◆ 5.コーディング基礎 -2.CSS基礎 ◆
コーディングに必要なCSS基礎
05-02-01CSSとは
05-02-02CSSの書き方・記述場所
05-02-03文字色 colorプロパティ
05-02-04文字の大きさ font-sizeプロパティ
05-02-05書体の設定 font-familyプロパティ
05-02-06文字の太さ font-weightプロパティ
05-02-07斜体 font-styleプロパティ
05-02-08文字列の配置 text-alignプロパティ
05-02-09文字装飾 text-decorationプロパティ
05-02-10インデント text-indentプロパティ
05-02-11行間 line-heightプロパティ
05-02-12文字間隔 letter-spacingプロパティ
05-02-13書体に関するプロパティの一括指定
05-02-14背景色 background-colorプロパティ
05-02-15背景画像 background-imageプロパティ
05-02-16背景画像の繰り返し background-repeatプロパティ
05-02-17背景画像の表示位置 background-positionプロパティ
05-02-18背景画像の表示サイズ background-sizeプロパティ
05-02-19背景画像の固定 background-attachmentプロパティ
05-02-20背景の一括指定 backgroundプロパティ
05-02-21リスト項目要素のマーカー指定 list-style-typeプロパティ
05-02-22リスト項目要素のマーカー画像指定 list-style-imageプロパティ
05-02-23リスト項目要素のマーカー位置指定 list-style-positionプロパティ
05-02-24リスト項目の一括指定 list-styleプロパティ
◆ 5.コーディング基礎 - 3.HTML CSSレイアウト ◆
ページ制作に必要なレイアウト基礎
05-03-01コメントアウト
05-03-02セレクタの種類
05-03-03レイアウトの作成
05-03-04要素の性質
05-03-05レイアウトに必要なCSSプロパティ
05-03-06内側余白・外側余白・枠線とボックスモデル
05-03-07フロートレイアウト
05-03-08ポジション
05-03-09リセットCSS
05-03-10CSSの優先順位
05-03-11擬似要素・before・after
◆ 5.コーディング基礎 - 4.CSSレイアウト(flex) ◆
ページ制作に必要なレイアウト基礎(flex)
05-04-01flexとは
05-04-02display:flex
05-04-03flex-direction
05-04-04flex-wrap
05-04-05justify-content
05-04-06align-items
05-04-07align-content
05-04-08order
05-04-09align-self
05-04-10flex-grow
05-04-11flex-shrink
05-04-12flex-basis
◆ 5.コーディング基礎 - 5.復習・課題サイト制作 ◆
ページ制作復習・課題サイト制作
05-05-01subject00制作方法
◆ 6.Photoshop - 1.Photoshop基礎 ◆
Adobe Photoshop基礎
06-01-01Photoshop-Photoshopとは
06-01-02Photoshop-Photoshopを起動してみよう
06-01-03-01Photoshop-各ツールの基礎知識1
06-01-03-02Photoshop-各ツールの基礎知識2
06-01-03-03Photoshop-各ツールの基礎知識3
06-01-03-04Photoshop-各ツールの基礎知識4
06-01-04-01Photoshop-各パネルの基礎知識1
06-01-04-02Photoshop-各パネルの基礎知識2
06-01-04-03Photoshop-各パネルの基礎知識3
06-01-04-04Photoshop-各パネルの基礎知識4
06-01-05Photoshop-マスク・フィルター
06-01-06Photoshop-ショートカット
◆ 7.実践的なコーディング - 1.Photoshopデザインカンプの読み取り方法 ◆
コーディングに必要なPhotoshop操作方法
07-01-01Photoshopの特徴
07-01-02文字パレッドの確認方法
07-01-03フォントの選定方法
07-01-04画像書き出し-01画像について
07-01-05画像書き出し-02スライスによる画像書き出し
07-01-06画像書き出し-03アセットによる画像書き出し
07-01-07画像書き出し-04パターン画像の書き出し方法
07-01-08画像書き出し-05書き出し画像の拡張子
07-01-09レスレイヤーとは
07-01-10余白角丸の測り方
◆ 7.実践的なコーディング - 2.sass基礎 ◆
CSSメタ言語Sassについての学習
07-02-01Sass基礎-Sassとは
07-02-02様々な記述方法と拡張子
07-02-03Sassを使うためのプラグイン
07-02-04Sass(SCSS)の基本的な書き方
07-02-05親セレクタの参照
07-02-06コメントアウト
07-02-07四則演算・インターポレーション
07-02-08変数
07-02-09インポート・ユーズ
07-02-10ミックスイン
07-02-11エクステンド
07-02-12Sass(SCSS記法)の記述まとめ
◆ 8.デザイン制作 -01-Illustrator ◆
Adobe Illustrator基礎
08-01-01-Illustratorとは
08-01-02Illustratorを起動してみよう
08-01-03-ツールバーについて
08-01-04各ツールの知識1
08-01-05各ツールの知識2
08-01-06各ツールの知識3
08-01-07各パネルの知識1
08-01-08各パネルの知識2
08-01-10各パネルの知識4
08-01-11各パネルの知識5
08-01-12よく使う操作・効果
08-01-13Illustrator_ショートカット
◆ 8.デザイン制作 - 2.AdobeXD ◆
Adobe XD基礎
08-01-09各パネルの知識3
08-02-01デザイン制作_AdobeXD
08-02-02ツール操作を覚えよう
08-02-03よく使用する操作を覚えよう
08-02-04デザインモックを作りながら操作を覚えよう
◆ 8.デザイン制作 - 3.実制作 ◆
デザイン概論・デザイン制作
08-03-01-デザイン概論
08-03-02-レイアウトの四原則
08-03-03-そもそもデザインとは
08-03-04バナー制作