【無料】WEBディレクションの修練場(練習問題でスキルを磨く)

WEBディレクションの修練場では、Web制作の現場で起こるさまざまなタスクをこなしながらWebディレクションスキルを身につけていただきます。

「Webディレクターに必要なスキルってどうやって覚えたらいいのかわからない」

僕自身もそうでしたが、Webディレクターの仕事って幅広いしどうやって身につけたらいいかよくわからないですよね。
ググってもあまりヒットしないし、難しい専門用語が並べられていて「何がゴールなのか」もいまいちよく分からない…。

そんな背景もあって、僕の経験を元に演習できるコンテンツを作りたい!という思いでこのコンテンツを作りました。

どの問題も現場レベルのリアルさにこだわって作っていますので、ぜひチャレンジしてみてください。

Webディレクターを目指している方はもちろん、Web担当になったばかりの方、Webの仕事に興味がある方など、広く活用いただけるかと思います。

Webサイト制作の流れ

Webサイト制作を始めるためには、まずは全体の流れを掴んでおくことが大事です。
「Webサイトがどういうプロセスで作られるのか」を知らないと、スケジュールも作れないし、進捗も分からない。
つまり、進行管理のしようがありません。
演習を通してWebサイト制作の流れを理解しましょう。

【ゴール】
Web制作の全体の流れ、各フェーズについて理解する。
また、各フェーズにかかる期間の目安を把握する。

Webサイト制作の流れ(練習問題)
WEBディレクションの修練場では実戦形式でWebディレクションスキルを磨いていただきます。今回のお題はWebサイト制作の流れ。

Webサイトの見積もり

Webサイトの見積もりは新規立ち上げ・リニューアル・ページ追加など、案件の受注前に出てきます。
Webサイトの見積もりに必要な項目を把握して、相場感を知っておくと業務に活かせます。
演習を通してWebサイトの見積もりができるようになりましょう。

【ゴール】
Webサイトの見積もり項目を理解する。
Web制作にかかる費用の相場を把握する。

Webサイトの見積もりの計算方法(練習問題)
WEBディレクションの修練場では実戦形式でWebディレクションスキルを磨いていただきます。今回のお題はWebサイトの見積もり。

Webサイト制作の要件定義

Webサイトを作る前に、まず始めにするのが要件定義。
これから作るWebサイトの仕様を固める作業です。
始めにしっかり要件を決めておかないと、後で追加要件が出てプロジェクトが遅れたり、サイアク1から作り直しになってしまうことも…。
そうならないためにも、しっかり要件定義ができるようになりましょう。

【ゴール】
Webサイトの要件定義ができるようになる。
→クライアントの課題・目的の確認から、デザイン、システム、運用に至るまで、Webサイトの仕様を固めるために必要な項目を把握する。

ヒアリングシートの作り方(Webサイト制作の要件定義)
WEBディレクションの修練場では実戦形式でWebディレクションスキルを磨いていただきます。今回のお題はWebサイト制作の要件定義。

サイトマップ(構造図)の作り方

Webサイト制作プロジェクトの始めの段階で行うのがサイト設計。
その際に、Webサイト構造をツリー状のイメージ図にまとめたものがサイトマップ(構造図)です。
サイトマップはクライアントや制作チームとサイト完成時の全体像の認識合わせをするのに使います。
サイトマップ(構造図)を作れるようになりましょう。

【ゴール】
サイトに必要なページを洗い出せるようになる。
基本のサイトマップ(構造図)が作れるようになる。

サイトマップ(構造図)の作り方(練習問題)
WEBディレクションの修練場では、実戦形式でWebディレクションスキルを磨いていただきます。今回のお題はサイトマップ(構造図)の作り方。

ディレクトリマップの作り方

ディレクトリマップはサイト設計時に作るサイト内のページを一覧化した表です。
サイトマップが視覚的にサイト構造を表した図であるのに対して、ディレクトリマップは階層構造やURL、titleなどのページ情報を一覧化した表です。
クライアントとの認識合わせや、Webデザイナー・WebエンジニアなどのWeb制作チームへの指示出しに使います。
ディレクトリマップが作れるようになりましょう。

【ゴール】
基本のディレクトリマップが作れるようになる。

ディレクトリマップの作り方(練習問題)
WEBディレクションの修練場では実戦形式でWebディレクションスキルを磨いていただきます。今回のテーマはディレクトリマップ。

ガントチャートの作り方

Web制作プロジェクトではスケジュール管理が肝です。
Web制作は公開日を目指して、クライアント・社内・外注先の多くの関係者と一緒にサイトを作っていくため、皆の共通認識を持った上でプロジェクトを進めるのが大事だからです。
Web制作のプロジェクト管理でよく使うガントチャートが作れるようになりましょう。

【ゴール】
基本のガントチャートが自分で作れるようになる。

Webディレクターのスケジュール管理方法(ガントチャートの作り方)
WEBディレクションの修練場では実戦形式でWebディレクションスキルを磨いていただきます。今回のお題はガントチャートの作り方。

ワイヤーフレームの作り方

Webデザインに入る前にはWebページ設計を行います。
その際に作るのがワイヤーフレーム。
ワイヤーフレームはページの構成要素や導線、レイアウトを決めるための設計書です。
Webディレクターの仕事の中でも特に多いのがこのワイヤーフレーム作り。
ワイヤーフレームの作り方の手順を身につけましょう。

【ゴール】
基本のワイヤーフレームが自分で作れるようになる。

ワイヤーフレームの作り方(練習問題)
WEBディレクションの修練場では実戦形式でWebディレクションスキルを磨いていただきます。今回のお題はワイヤーフレームの作り方。

Webサイト公開前のチェックリスト

Webページの構築が終わったら、公開前に必ず行うのが検証。
検証では、デザインの表示崩れはないか、コーディングルールに則って構築されているか、SEO設定やアクセス解析タグ設定は正しくされているか、問い合わせフォームなどのシステム部分は正常に動作するか、セキュリティ対策は取られているかなどのチェックを行います。
かなり項目数が多いので、始めのうちは戸惑うかもしれませんが、場数がものをいう部分なので、気にしなくて大丈夫です。
よくあるチェック項目を紹介しますので、ざっと把握しておきましょう。

【ゴール】
サイト公開前のチェック項目にどんなものがあるのかを把握しておく。

Webサイト公開前のチェックリスト
WEBディレクションの修練場では実戦形式でWebディレクションスキルを磨いていただきます。今回のテーマはWebサイト公開前のチェックリスト。