<仕様書>

実際の案件で送られてきたものをベースに作成しています。そのため、必要事項が十分に記載されていなかったり内容が不明瞭なものも含まれていますが、そういったところも直さずリアルに再現しています。不明な点があれば、実案件だったらどういった質問、確認をするのかを考えながらコーディングしてみましょう。
単価
納期
デザイン
仕様
※全て実案件をもとにしています。
Codestep Proは、コーディングのプロを目指す方(特に企業からのコーディング案件獲得を目指す方)を対象にした、月額制のコーディング学習サービスです。
実案件をもとに開発された、実務レベルの経験を積んでいただくための学習教材になります。
企業からのコーディング案件受注を想定した、
実践的なコーディング学習サービスです。
実案件をモデルにしたコーディング教材(※以下、仮想案件と呼びます)を、
毎月1件ずつ全12回お送りいたします。
単価、納期、納品方法など、全てリアルなものとなっております。
お送りする仮想案件の内容や難易度は実案件と同じく様々です。
中には自分のスキルが全く通用しない、
これが実案件だったらと思うとゾッとする案件に出くわすかもしれません。
そんなリスクに事前に備えることで、
本番で最高のパフォーマンスを発揮していただければと思います。
Codestep Proは、過去の実案件をモデルにした「仮想案件」と呼ばれる案件教材を通して、実務レベルの経験値を積み上げていくことで、実案件での失敗やトラブルを未然に防ぐことを目的に開発したコーディング学習サービスです。
受験の前に過去問題を解くように、実案件の前に過去案件相応の経験を積んでおくことで、本番での失敗やトラブルを大きく減らすことができると考えています。
実案件の経験がまだの方、少ない方が、本番と同じレベルの経験を積むための教材としてご活用いただけます。
Codestepは「スキル」を積むことを目的にしたコーディング学習教材ですが、Codestep Proは「経験」を積むことにフォーカスしたコーディング学習サービスです。
Codestep Proを活用することで、実案件をこなしていくために必要な経験値を積み上げることができます。
主に下記のような経験を積むことができます。
毎月、仮想案件を1件メールにてお送りいたします。
仮想案件は全12回です。
お送りする内容は下記の通りとなります。
※案件によって内容が異なります。
※デザインデータは、Adobe XDです。(XDのインストールは不要です。)
※コーディングは、HTML、CSS、JavaScriptを使用します。(WordPressは使用しません。)
<仕様書>
実際の案件で送られてきたものをベースに作成しています。そのため、必要事項が十分に記載されていなかったり内容が不明瞭なものも含まれていますが、そういったところも直さずリアルに再現しています。不明な点があれば、実案件だったらどういった質問、確認をするのかを考えながらコーディングしてみましょう。
<デザインデータ>
実際の案件で送られてきたものをベースに作成しています。中にはスマホのデザインがなかったり、原稿からコーディングを行うような案件があるのも実務ならではです。
※データはPhotoshopやIllustratorで送られてきたものもありますが、学習者の環境を考慮してXDで作りなおしています。
<素材>
素材についても、実際の案件と同じ方法でのご提供となります。書き出した画像を一式ご提供する場合もあれば、XDから書き出していただく場合もあります。実案件ではコーディングの依頼がきたタイミングでは仮の画像が設定されている場合がありますので、その場合も実務と同じように仮の画像でコーディングを行っていただきます。
<その他、資料等>
実案件では、QA管理や仕様の指示でGoogleドキュメントやPDF、イメージキャプチャなどの資料を使用することがあります。資料を用いた案件では仮想案件でも同じように資料を用意していますので、案件によっては複数の資料を読み解く力が必要になってきます。
例1コーポレートサイト新規制作案件
難易度:
シンプルなコーポレートサイトをトップページから企業情報、ニュース、プライバシーポリシーまで一式制作します。構成がシンプルでボリュームも少ないため難易度は低めですが、納期が短いため時間を意識したコーディングが必要です。
例2特設ページ追加案件
難易度:
WordPressへ組み込む前のHTMLのコーディング案件です。トップ、一覧、詳細ページの制作を行います。対応ブラウザが細かく指定されているので、動作確認もしっかりと行いましょう。
例3プロモーション用新規LP制作案件
難易度:
プロモーション用のLP案件です。サイト全体に装飾が多いため、どの部分を画像にしてどの部分をコーディングするかの見極めが重要です。少しアニメーションも入るので、難易度はやや高めの案件になります。
例4原稿からのコーディング
デザインデータが完璧にそろっている案件ばかりではありません。中にはトップページのデザインデータだけ支給されて、下層ページはトーンをあわせながら原稿からコーディングしていくような案件もあります。これができると、企業からは重宝されるかもしれませんね。
例5スプレッドシートで課題管理
QAや課題の管理をスプレッドシートで行うケースもあります。実案件では、コーディング力だけでなく指示内容の読解力、理解力も重要なスキルになってきます。
仮想案件の事例
豊富な案件バリエーションの中から毎月1件お送りいたします!
プランを選択して、専用フォームからお申込みください。
月額980円 (税込1,078円)
プランを選択する
内容仮想案件をコーディングして完了です。
月額1,860円 (税込2,046円)
プランを選択する
内容仮想案件のコーディングが完了した後に、レイアウト構成の解説とコーディング例のソースコードを参考にセルフチェックを行えます。
月額3,980円 (税込4,378円)
プランを選択する
内容仮想案件のコーディングが完了した後、納品まで行っていただき、納品後の動作確認結果にて成果物の品質確認を行えます。また、レイアウト構成の解説とコーディング例のソースコードを参考にセルフチェックも行えます。
ポートフォリオへの掲載もOK! ※1
Codestep Proの制作物を、一部条件付で制作実績としてポートフォリオへ掲載いただけます。実案件をベースにした制作物で、あなたのポートフォリオがより充実したものに変身します!
※1 ポートフォリオへの掲載は、ベーシック認証の設定、仮想案件のサイト名の変更等、一定の条件を満たしている場合のみ可能です。
Codestep Pro は、実案件を想定した本格的な学習サービスです。
学習の効果をより実感していただくために、一定のコーディングスキルと学習の目的を持った方のみを対象とさせていただきます。
下記のいずれかに該当する方のみが、お申込みの対象となります。
お申し込み(ライトプラン)
プランを選択して、お申し込みページからお申し込みください。
仮想案件の受け取り
毎月メールにて仮想案件を1件お送りいたします。
※初月はお申し込み完了日(決済日)にお送りいたします。2回目以降は、30日ごとに決済が完了したタイミングで1件ずつお送りいたします。
コーディング
仕様書とデザインデータをもとに記載されている納期までにコーディングを仕上げましょう。仕様書やデザインデータだけでは情報が不十分な場合は、ユーザビリティを考慮しながら自分なりに考えてコーディングしてみましょう。
※納品やフィードバックはありません。
お申し込み(スタンダードプラン)
プランを選択して、お申し込みページからお申し込みください。
仮想案件の受け取り
毎月メールにて仮想案件を1件お送りいたします。
※初月はお申し込み完了日(決済日)にお送りいたします。2回目以降は、30日ごとに決済が完了したタイミングで1件ずつお送りいたします。
コーディング
仕様書とデザインデータをもとに記載されている納期までにコーディングを仕上げましょう。仕様書やデザインデータだけでは情報が不十分な場合は、ユーザビリティを考慮しながら自分なりに考えてコーディングしてみましょう。
セルフチェック
コーディングと動作確認が完了したら、ソースコードのチェックを行いましょう。コーディング例を参考にしながら、分からなかった箇所を復習したり改善できそうなコードを確認して次回の仮想案件に役立ててください。
お申し込み(プレミアムプラン)
プランを選択して、お申し込みページからお申し込みください。
仮想案件の受け取り
毎月メールにて仮想案件を1件お送りいたします。
※初月はお申し込み完了日(決済日)にお送りいたします。2回目以降は、30日ごとに決済が完了したタイミングで1件ずつお送りいたします。
コーディング
仕様書とデザインデータをもとに記載されている納期までにコーディングを仕上げましょう。仕様書やデザインデータだけでは情報が不十分な場合は、ユーザビリティを考慮しながら自分なりに考えてコーディングしてみましょう。
納品
コーディングが完了したらフォルダ一式をzipファイルに圧縮し、専用のフォームから送信してください。5営業日以内に動作確認結果をお送りいたします。
※納品期限は仮想案件を受け取ってから30日間となります。
結果確認
確認結果に指摘事項がある場合は、ソースコードの修正を行いましょう。修正が完了したら必ず自分で動作確認を行ってください。また、コーディング例のソースコードも参考にしながらコーディングの改善に役立ててください。
鹿児島県にお住まいの
kanako 様
茨城県にお住まいの
C 様
C 様
Codestep Proにお申し込みいただきありがとうございます。おっしゃる通り、デザインデータを見た時はできそうな感じがしても、実際に手を動かしてみると想定外のことに出くわしたりして思っている以上に時間がかかってしまうものです。全ての案件に実際の納期が記載されていますので、スケジュール感を意識しながら取り組んでいただくことで、より実務に近い練習をしていただけるかと思います。
静岡県にお住まいの
gadget96 様
gadget96 様
Codestep Proにお申し込みいただきありがとうございます。また、Proが出る前からご利用していただいていたとのこと、いつもありがとうございます。楽しみながらコーディングできるのが一番いいですね。その方がスキルアップも早いかと思います。フィードバックできる環境がほしいとのこと、貴重なご意見ありがとうございます。コーディング例や解説などをご提供できるようなプランも今後検討していきたいと思います。ありがとうございました。
埼玉県にお住まいの
小川 愛 様
小川 愛 様
Codestep Proにお申し込みいただきありがとうございます。実案件と同じような緊張感を持って取り組まれているとのこと、まさにCodestep Proを有効的にご活用いただけている思います。作業にかかった時間をメモするのも大事ですね。(初回の案件7時間はかなり早いです!)実案件では期日内に仕上げるということがとても重要になってきますので、これからも時間を意識したコーディング経験をどんどん積み上げていってください。
愛知県にお住まいの
M.T. 様
M.T. 様
Codestep Proにお申し込みいただきありがとうございます。Codestep Proはすべて実案件をベースにしていますので、自分が今、企業案件を受注できるスキルかどうかの判断に利用していただくのに最適だと思います。企業からの案件バリエーションには簡単なものから難しいものまで様々なものがあります。Codestep Proの仮想案件を通して、自分ができることとできないことを明確にしていただき、本番への準備に備えていただけましたら幸いです。
東京都にお住まいの
A.S. 様
A.S. 様
Codestep Proにお申し込みいただきありがとうございます。ボリューム感がちょうど良いとのことよかったです。確かにもっとスピードをあげて学習したい方にとっては少し案件頻度が少ないかもしれないですね。今後、学習ペースを上げたい人は追加で練習できるような改善も検討していきたいと思います。貴重なご意見ありがとうございました。
北海道にお住まいの
らたあ 様
らたあ 様
Codestep Proにお申し込みいただきありがとうございます。学習しなければならないことが明確になったのは、とても良い収穫だったのではないでしょうか。ある程度コーディング学習が進んでくると、練習教材からだけでは自分ができないことを見つけるのが段々と難しくなってきます。Codestep Proを利用していただくことで、実務でしか直面しないような課題を見つけることができるかと思いますので、一つ一つ課題をクリアしながらスキルの幅を広げていっていただければと思います。
埼玉県にお住まいの
T.K. 様
T.K. 様
Codestep Proにお申し込みいただきありがとうございます。実案件を行う上で納期は品質と並んでとても重要な要素です。全ての仮想案件には実際の納期と同じ期日が設定されていますので、色々な仮想案件をこなしながら案件のスケジュール感をつかんでいただければと思います。実績掲載の件は、記載がなくて申し訳ございませんでした。「よくある質問」の中に追記しておきました。ご指摘ありがとうございました。
神奈川県にお住まいの
おーすけ 様
おーすけ 様
Codestep Proにお申し込みいただきありがとうございます。今回は第1回目ということで仮想案件をお渡しするだけのサービスでしたが、今後はコーディング後に納品を行っていただき動作確認をして結果フィードバックするようなプランもご提供できるよう改善していきたいと思っています。Codestep Proで本番のリハーサルができるようなサービスに仕上げていきたいと思っていますので、今後とも宜しくお願いいたします。
東京都にお住まいの
R.Fumika 様
R.Fumika 様
Codestep Proにお申し込みいただきありがとうございます。ご意見いただきましてありがとうございます。確かに、コーディング例があると、自分がコーディングしたものをチェックしたり分からなかった箇所のソースコードを確認できたりするので、よりスキルアップにつながりますね。いただいたご意見を参考に今後のサービス改善に努めます。貴重なご意見ありがとうございました。
大阪府にお住まいの
クロ 様
クロ 様
Codestep Proにお申し込みいただきありがとうございます。まずはトライしてみることが大事ですね。実際の案件でどのような内容が送られてくるのか?どれくらいの期日が設定されているのか?どんなデザインでどんな仕様なのか?自分のスキルでできるのか?このようなことは本来なら実際に案件を受けてみるまでわからないようなことですが、それを事前にリハーサルできるのがCodestep Proです。クロ様がおっしゃられた通り不安が解消されることで自信にもつながりますので、今後も色々な仮想案件を経験していただきながら、自信を持って本番に望んでいただけたらと思います。
静岡県にお住まいの
kky 様
kky 様
Codestep Proにお申し込みいただきありがとうございます。実際の案件ではJQueryを使う機会は多々ありますが、ハンバーガーメニューをはじめ、カルーセルスライダーやアコーディオン等よく使用するパターンはある程度しぼられてきます。Codestep Proの仮想案件の中にもよく使用するjQueryがまんべんなく入っていますので、数多くこなしていただきながら実務に対応できるスキルを手にいれていただければと思います。
千葉県にお住まいの
tk4099 様
tk4099 様
Codestep Proにお申し込みいただきありがとうございます。調べながらでも、自力でコーディングされるのが一番スキルアップにつながるかと思います。Codestepにはレイアウト構成やコーディング例をつけていましたが、Codestep Proは本番を想定した仮想案件ということで、あえてコーディング例などは付けないようにしていました。本番では、分からないことにでくわした場合、調べて解決するという力がとても大切になってきますので、Codestep Proでも同様の練習を行うことで、本番に向けた良いリハーサルになるかと思います。
A下記の条件を満たしている場合のみ、掲載可能です。
・ベーシック認証の設定
ポートフォリオ全体、またはCodestep Proの制作物に対してIDとパスワードを設定して一般公開はしないでください。
・仮想案件のサイト名の変更
ロゴやテキスト等、仮想案件のサイト名が含まれている箇所はご自身で制作したオリジナルのものに変更してください。
・参照元を記載しない
デザインや制作物の参照元が、Codestep である旨の記載は行わないでください。
kanako 様
Codestep Proにお申し込みいただきありがとうございます。試行錯誤されながら取り組まれているとのこと、かなりスキルアップにつながっているのではないでしょうか。実務のコーディングでは、考える力とあわせて調べる力もとても重要になってきます。毎回、本番のように取り組むことで解答を見ながらコーディングするよりも何倍ものスキルが身につきます。これからも継続して頑張ってください。