実案件レベルの仕様でコーディングが練習できて
自分のポートフォリオとして営業に使えるデザインカンプを作りました！
うしくん今の自分のレベルで案件を受けて大丈夫か不安・・・
うしくん案件ってどこまでの要求をされるのかわからないから怖い・・・
うしくんそもそも営業のポートフォリオってどんなのがいいのかわからない(泣)
こんな悩みをお持ちの方も多いのではないでしょうか。
実際私も初めての案件を受けるために営業に挑む際は
『自分のレベルで本当に大丈夫か』
『どんな内容の依頼が提示されるのか』
『どこまで細かくチェックされるのか』
『自分の作ったポートフォリオは評価されるのか』
そんな悩みを抱えてました。
実際制作会社さんとお仕事をさせていただいて、僕が全然気をつけて見れなかったところまで細かくチェックしていただき、何往復も修正を繰り返してしまうなどと迷惑をかけてしまうことも多々ありました・・・
ポートフォリオサイトに関しても、自分でデザインしたサイトだったため本当に評価されるかわからず、返信いただいた制作会社さんには良かった点や悪かった点、どんなポイントを見ているかなど尋ねていました。
そこで同じような悩みを持ってなかなか営業に向かえない方のために『実案件レベルの仕様でコーディング練習ができて』『実案件レベルの粒度で表示チェックを受けれて』『制作会社から評価されやすい自分のポートフォリオサイトとして使用できる』デザインカンプを作りました。
たんしお僕がたくさんダメ出しを食らってきた叡智の結晶としてここにおいておくよ！
サービス内容
本サービスは、以下のような特徴があります。
- XDのデザインカンプでコーディング練習ができる
- 実案件レベルの仕様のコーディングを体験できる
- 頻出なアニメーションやjQueryを練習できる
- 実案件レベルの表示チェックのフィードバックを受けれる
- 下層ページのデザイン付きでWP化まで対応している
- アレンジしてポートフォリオとして営業に使用できる
- 営業ポートフォリオとしてのアドバイスを受けれる
①XDのデザインカンプでコーディング練習ができる
制作会社からコーディング用のデザインデータとして渡される形式の最も多いものがXDになります。
XDからのコーディングの経験がある方が自信を持って実案件に挑めます。
まずは案件に挑む前に経験しておき、自信をつけましょう。
②実案件レベルの仕様のコーディングを体験できる
実案件では練習で架空サイトのコーディングを行うときなどと異なり、細かい仕様などの指定が存在します。
今回のデザインカンプは細かな動きや表示など、実案件を想定したコーディングの仕様を設けてあります。
また、アニメーションやjQueryを要する動きなどはいずれも案件で頻出なものをあえて多く用意しました。
ある程度仕様の指示がある中で、正確に再現する練習を経験することができます。
ロードマップでいうところの2ヶ月目のレベルチェックテストに当たります。
③頻出なアニメーションやjQueryを練習できる
コーディングの案件において、アニメーションやjQueryを用いた機能などが全く存在しないパターンはほとんどありません。
また、上記のアニメーションや機能は、一度コードのストックを作ってしまえばうまいこと使いまわせることが多いです。
案件に挑む前に頻出な機能のコードストックを作っておき、同じような案件に当たったとき使いまわせるように準備ができます。
④実案件レベルの表示チェックのフィードバックを受けれる
制作会社の案件では、こちらは大丈夫だと思っていたような部分でも細かく指摘を受けます。
これらのチェックの細かさの意識は一度でも味わっておかないとわからないもので、知らずに案件に挑んでしまうと制作会社側に迷惑をかけたり、信用失墜につながる場合があります。
案件に挑む前に、コーディング前にどこまで気にしてチェックしておく必要があるのかを知ることができます。
⑤下層ページのデザイン付きでWP化まで対応している
制作会社への営業を行う場合、ポートフォリオのWP化は技術の差別化として最も重要なポイントです。
④までの内容の他にWP化用の下層ページのデザインカンプもついているので、コーディングしてポートフォリオをWP化することが可能です。
具体的にどのように更新可能にするのかの実案件よりも詳細な仕様がついているため、迷わずWP化できるだけでなく、自分のWPの理解を確認する力試しにもなります。
ロードマップでいうところの3ヶ月目のレベルチェックテストに当たります。
⑥アレンジしてポートフォリオとして営業に使用できる
自分でデザインしたポートフォリオサイトがいまいちだと、せっかく能力があっても見向きもしてもらえない可能性があります。
今回用意したデザインカンプは制作会社から評価される内容を詰め込んだものになっております。
本サービスのデザインカンプをアレンジして、自分のポートフォリオサイトとしてそのまま営業に使用できます。
⑦営業ポートフォリオとしてのアドバイスを受けれる
当然ですが、完全にデザインカンプそのままでポートフォリオサイトとして営業に使用するのは控えてください。
ご自身でアレンジいただきますが、その内容を確認させていただき、どう変更したらより良いかアドバイスさせていただきます。
デザインカンプの概要
デザインカンプ内で要求される機能や技術は以下になります。
- レスポンシブデザイン（PC・SPはデザインあり）
- Sassを用いたコーディング
- BEMでのCSS設計（推奨）
- ホバーアニメーション
- スムーススクロール
- ハンバーガーメニュー
- アコーディオン
- スライダー
- スクロールでフェードイン
- カスタムフィールド
- カスタム投稿
- 確認画面付きお問い合わせフォーム
トップページは以下のようなものになります。
コーディングの仕様やデザインの動きの仕様などの指示書も細かく用意してあります。
細かく見てくる制作会社さんも多々いるので、割と厳し目な練習ができると思います。
サービス利用の流れ
表示チェックやポートフォリオアドバイスのサポートを含むため、必ず以下の流れでご利用いただきますようお願いいたします。
サービス内容や注意事項などをよくご確認の上、購入ボタンよりご購入ください。
専用Slack内でデザインカンプの配布を行います。
まずは2ヶ月目レベルチェックテスト用のデザインデータを取り扱います。
デザインデータの仕様書に基づいて、デザイン・仕様の通りコーディングしていただきます。
ご自身でご準備いただいたテスト環境にアップロードし、ファイル一式も納品いただきます。
テスト環境はBasic認証をかけてアップロードしてください。
ファイルの納品方法は問いません。
納品いただいたデータの表示チェックを行い、フィードバックを送付いたします。
表示チェックは実際に私が制作会社の方から受けるような厳しさでチェックを行い、修正事項等をまとめた資料をお渡しします。
フィードバックを受けた修正内容を反映して修正いただきます。
修正内容に対する再フィードバックは有料とさせていただきます。
（5,000円）
ここまでが2ヶ月目レベルチェックテストの内容となります。
WP学習前の方は3ヶ月目の内容を終えてから以下のサービスにお進みください。
続いて3ヶ月目レベルチェックテスト用のデザインデータを取り扱います。
トップページは大きく変更はありませんが、WP化・アレンジしやすいように再度きれいにコーディングいただくことをお勧めします。
下層ページはお問い合わせの確認・完了ページ含めて6ページあります。すべてWP化を想定に入れてコーディングしてください。
こちらはデザインデータ通りにコーディングする必要はありません。ご自身のポートフォリオとしてアレンジしてコーディングすることをお勧めします。
デザインデータの仕様書に基づいて、コーディングしたポートフォリオをWP化していただきます。
基本的にはロードマップの理解度チェックで作成するサイトで用いた技術を使用します。
限定記事のWordPress構築の流れなどを参考に進めていきましょう。
ポートフォリオ用にアレンジしたものをテスト環境にアップロードしていただきます。
テスト環境はBasic認証をかけてアップロードしてください。
ここまでが3ヶ月目レベルチェックテストの内容となります。
アップロードしていただいたポートフォリオをチェックさせていただき、作成いただいたテキストやコンテンツなどについてのアドバイスを含めZOOM等にて30分ほどのアドバイスをさせていただきます。
あなただけの素敵なポートフォリオサイトが完成しました！
さあ、このポートフォリオで制作会社に営業をかけて、確かな技術で制作会社の力になって『Web制作で稼ぐ』を体感しましょう！
購入対象者
デザイン表示チェックサービスの性質上、購入対象として以下の条件は必須とさせていただきます。
・たんしおロードマップ2ヶ月目レベルチェックテスト手前まで終えている（HTML/CSS/Sass/JavaScript/jQueryの基礎学習を終えている）
・XDのデータからのコーディング経験あり
・技術向上への意欲のある方
・Web制作で収益を出す意欲のある方
また、以下の内容はサービスの対象ではございません。
・コードの回答例の配布
・コーディングのやり方などに関する質問対応
・コードレビューなど納品いただいたコード自体のチェック
注意事項
お申し込み前に以下の注意事項を必ずよくお読みください。
- コーディングに関する質問にはお答えできかねます。
- 正解コードはつきません。
- コード自体のチェックは原則行いません。
- 2度目以降の表示チェックは追加料金が発生します。
- カンプのデザインのままご自身のポートフォリオとして使用することはお控えください。
- サービスの性質上お申し込み後の返金対応はできかねますのでご了承願います。