独学・未経験でWeb制作を学びフリーランスになった流れ【経験談】

どうも、ケンタロウ(@kentaro_koga)です

友人と福岡でWeb制作の仕事をしており、あっという間に3年過ぎました。

この記事では自分がどのように独学・未経験からフリーランスになったのか紹介していきます。

読んで欲しい方

  • Web制作に興味がある方(デザイナー・ディベロッパー)
  • 独学・未経験で不安な方
  • 僕達に興味がある方

では参ります。


基礎を学ぶ

僕はそもそも文系でコードを見たこともなかったですし、存在も知らなかったですw

なので最初はネットでWebサイトってどうやってできているのか勉強することから始まりました。

実は大学卒業後に1度Web制作の勉強をしてみたのですが、一瞬で「ナニコレ?」となり挫折しましたw

ただ今回は高校のクラスメイトとの偶然の再開もあり、しかもWebに興味があるということで、一緒に勉強することになりました。

定期的に勉強会をする

当時僕はバイトをしていたのですが、できる範囲で近くのカフェに友人と集まって勉強するようになりました。

そこではHTMLやCSSの問題を解いたり、レイアウトの作り方を学んだりしていました。

主に「ドットインストール」を見て勉強をしていました。

そこでHTML/CSS/JavaScript/Jquery/WordPress/Bootstrapなどを勉強しました。

僕はJavaScriptがどうしてもできなくてJqueryに逃げましたww

一人でも本やネットで勉強する

もちろん時間がある時に1人でも勉強をしていました。

英語が一応できるので、codecademyをやったりもしましたね。

本は大体2人で共有していて、デザインやコーディングの本をいくつか購入しました。

一番最初に買った本は以下の本でした。

結構ゆるくですが、マイペースに勉強してましたね。

なので短期間で案件取れましたというツイートを見るとスゴイなーっとなります

練習をする

基礎を勉強したらとにかく練習をしました。

学んだことも使わないと忘れます。

特に僕は忘れっぽいので何度も復習しないとすぐ忘れますww

Webサービスを作る

データベースとのやりとりなど一通り練習できるからWebサービスを作ってみようということになりました。

また、お互いに筋トレが好きなので「懸垂ができる場所がまとめてあったら良いよね」ということでマップサイトを作りましたw

僕はあまりデータベースとのやりとりの部分は触っていないのですが、色々と勉強になりました。

今見るとデザイン全然ダメですねww
リニューアルしないと。。

Webサイトを作る

自分自身のポートフォリオサイトがなかったので、当時自分ができることを絞り出してサイトを作りました。懐かしいw

デザインからコーディング、色々と勉強になりましたし、完成した時の達成感は気持ちよかったですね

今見ると本当にしょぼいサイトなんですが、0から何かを作るのはとても勉強になりますし、アウトプットの過程でいろんな学びもあります。

なので、基礎を学んだら実際に手を動かして何か作ってみるのが本当におすすめです。

デザインもコーディングも練習、前回より良くしようという気持ちが大事ですね^ ^

何度も練習する

サイトを作った後、また何度かちっちゃめのサイトを制作しています。

デザインも当時はXDを使いこなすために、DailyUIをXD縛りでやってみたり、Photoshopで架空のランディングページを作ってみたり、色々勉強しつつ手を動かし続けました。

ReactでSPAを勉強していた時には以下のサイトを作りました。

こちら

GatsbyとContentfulを勉強していた時は以下のブログを作ったりもw

こっちに移動してます

.devドメインを取って練習場所も作りました!(今はGatsbyとWordPressのブログ)

こんな感じで、どんどんインプットとアウトプットを繰り返します。

最初の方のインプットは忘れてしまってもいいですし、全部100%暗記しなくていいです。

手を動かして何か成果物を残す。すると当時の自分のレベルもわかりますし、自分の成長もわかります。

別に作ったものを公開しなくてもオッケーで、自分で自分の成長がわかればいいですし、学んだことの練習ができればそれでいいと思います^ ^

ただどこかに公開しておいたり、誰かに見せれるようにしておくと、後々仕事を獲る時に見せれるので便利です。

勉強の方法はまた別で記事を書きます。(以前も書きましたがアプデします)

仕事を探す

独学・未経験で仕事を探すのは正直超大変です。

当時は業界のことも全く知らないですし、相場もわかりません。

Web業界の友人も全然いないですし、仕事の進め方(ディレクション)もなんとなくしかわかりませんでした。

なので振り返ってみると、1人だったらフリーランスでいきなり独立するのではなく、どこかに就職していたかもしれません。

さて、実際はサイトがある程度作れるレベルになった時に友人と2人で開業届を出しました。
(この時僕はバイトを辞めてます)

うろ覚えですが、いきなり起業などは考えず、お互い個人事業主になり、協業する形にしました。

クラウドソーシング

まずはみなさんご存知のクラウドソーシングから始めました。

クラウドソーシングは「クラウドワークス」「ランサーズ」を使っていました。

理由は特になく、ただ自分たちができる案件がそこに載っていたから、応募しました。

クラウドソーシングで一番最初に取った案件はWordPressでのサイト構築で、テーマのカスタマイズと見積もり機能の実装でした。

クラウドソーシングの相場は普通の相場の半分ほどと良く聞きますし、いい案件は応募の数が半端ないので獲れにくいですが、応募の文章を工夫するなりして、チラホラ案件を獲っていました。

クラウドソーシングもやりようによっては稼げますし、駆け出しの方や副業で月数万稼ぎたい人には良いかと思います。

クラウドワークスランサーズもすぐに登録して始めれるので、最初の入り口としては良い場所ですが、何年もいる場所ではないかと思います。(Web制作に関しては)

営業

クラウドソーシングも慣れてきて、ちょっと別の案件の取り方をしようということで、制作会社さんにメール営業したり、カフェなどのお店にメッセージを送ったりなど直営業もしました。

何度かお返事をいただいて会社に訪問させていただいたりしましたが、実際に仕事に繋がることはあまりありませんでした。打った数も少ないので、多分もっと打ちまくればよかったのかなとも思いました。

制作会社に片っ端から営業メールを送りまくる方法もありましたが、僕たちはその制作会社のサイトをしっかりみて「この会社素敵だな」「一緒に仕事させていただきたいな」など感じたところに送ると決めていました。

なので打った数も少なめで当然当たった数も少なめです。

素敵な制作会社さんはたくさんあるので、これから営業することもあるかもしれません(今はリソース足りないくらいなのでしませんがw)

繋がりからのお仕事

福岡のエンジニアさんやデザイナーさんとの繋がりクラウドソーシングやTwitterでの繋がり、イベントでの繋がりからお仕事が入ることが出てきました。

何度もリピートで案件を相談してくれている方もいらっしゃり、とても有り難いことです。

やっぱり繋がりは大事で、そこからいただくお仕事はもっと大事です。

クラウドソーシングはやっぱり「コスパ重視」の発注

繋がりからの案件は「その人重視」の発注かと思います。

もちろん失敗やうまくいかなかったこともありますが、リピートでお願いしていただけるように最善を尽くしてます。

今はイベントは減っていますが、デザインやエンジニア系の勉強会やイベントにはもっと参加したいと考えています。

エンジニア系のマッチングサイトを試す

たまたま見つけたエンジニア系のマッチングサイト、Workshipに実験的に登録してみました。

そもそもWebデザイナーで活動しているので、どうかと思いましたが、フロントエンドもまぁやっているので登録して良い感じの募集を探していました。

そこでNuxtJSの案件ができる人の募集があり、相方がNuxtJSが得意なので応募してみました。

(ちなみに友人でやっているWeb制作チームのサイト、FumpはNuxtJSでできており、僕自身も少しは経験ありです。)

すると、是非お願いしたいと連絡が入り、Nuxt案件をすることになりました。

それ以来最近はNuxtJSをずっと触っています^ ^

WordPressの経験は多数あったのですが、昨年あたりからJamstackでやりたいよねと友人とも話していました。

でもクラウドソーシングにはなかなかJamstack案件は無く、ほぼWordPressだったのでどうしようか考えていたところでした。

(クラウドソーシングから1回だけNuxtJSとContentfulの案件をやったことはあります)

今は僕もNuxtJSの勉強をしつつ、デザインの勉強をしています。

もっと詳しい案件の獲得方法は別で記事を書きます。

常にインプット・アウトプット

フリーランスになって3年以上経ったのですが、ずーーーーっと勉強していますw

駆け出しの頃はWordPressのテーマのカスタマイズやコーディングで手一杯で、デザインのクオリティもコーディングのクオリティもスピードも今見返すと酷いですし、単価もかなり低かったです。

でもそれは常にインプット・アウトプットをしてきたから分かることで、3年前からずっと同じことをしていたら見返してもあまり感じることはないかと思います。

なので常に向上心をもって手を動かすのが、独学・未経験でフリーランスになるには大事なことだと思っています。

良きサイトをみまくる

僕自身はコーディングもしますが、エンジニアよりはデザイナー寄りなので、デザインの勉強を多めに行っています。

とにかくサイトをみまくって、どんな表現が使われているか、どんなとこが好きなのか、どんなレイアウトなのか、ページ遷移、ローディングなど色々とにかくみまくります。

毎日何かしらのサイトを舐めまわします(言い方w)

僕がよくみているサイトは以下です

自分の好きなサイトだけでなく、いろんなテイストのサイトをみて研究します

自分もまだまだなのでほぼ毎日上のサイトで勉強させていただいています^ ^

情報発信する+している人をフォロー

基本的にSNSで情報を収集しています。

僕がフォローしている属性の方は「デザイナー・エンジニア・カメラマン・友人」などです

ただ、たくさんフォローしているとタイムラインが長ーくなってしまうので、「Nuzzel」というアプリを使って、フォローしている人がシェアした記事やリンクをチェックしています。

コレ結構便利です。

最近観ているor聴いているWeb系のコンテンツは以下です

未経験から独立しているので、業界のことはあまり知らなかったのですが、営業の時のトークや上記のコンテンツを観て聴いて勉強させていただいてます^ ^

どれもすごく勉強になるので、是非チェックしてみてください。

最後のsyntaxは英語ですが、Wes BosさんScott Tolinskiさんも面白いですし、ガッツリエンジニアしてるので是非チェックしてみてください。2人とも色んな技術のレッスン・コースも出しています。

新しいものは周りを気にせず興味があれば触ってみる

勉強していると新しい表現やトレンド、技術が出てきます。

そこでその新しいものに対しての周りの人の評価をあまり気にせずに自分が興味があればどんどん触ってみて良いと思っています。

「NuxtJSよりNextJSの方が〇〇」や「こっちの方が〇〇だよね」といった意見も参考にはなりますが、それを辞めておく理由にしないでおきましょう。

興味があればやってみる。ダメなら違うのをやる。元々やっていたものをやる。という風に、いろんなものに触れておくと、柔軟になります。

もちろん1つのことを極めるのも良いと思います^ ^

ただ、技術は沼です。そもそもサイト制作するだけならWordPressで十分ですし、Jqueryでもアニメーションは実装できます。

案件の予算感によっても変わってくるかと思いますし、クライアントさんの要望もあるかと思います。

なので、色々なものに触れておいて、色々な状況に対応・提案できるようにしておくと強いと思っています。

【まとめ】常に追いかける。デザインもコードも。

今いるところで立ち止まるのではなく、前に進むことを心がけると、技術が停滞しないと思います。

これはみんなが言っている事かと思うのですが、Webの技術は進化が早いので、今している事が数年後古い手法になっているかもしれません。

なので、常にキャッチアップして、インプット・アウトプットをすると成長できると考えています。

ずっとWordPressや静的サイトの制作がほとんどだったのですが、最近はチームでNuxtJSの案件を受け始めていて、Nuxtの多言語のサイトも先日チームで制作しました。

これも日頃のインプット・アウトプットがあったおかげです。

また、チームで活動するのも幅が広くなるので良いと思っています。

僕もフロントコーディングもしますが、主にワイヤー・デザイン・撮影・レタッチなどを担当し、相方はフロントエンド・バックエンド・機能の実装・デプロイや公開作業を担当しています。

デザイン段階で会議したりアイデアを出し合ったり、所々グラデーションがありますが、役割分担をすることで効率よく開発が行えますし、それぞれのスキルも散らばらないです^ ^

お互いに新しいものに触れたり、ものを作ったり、勉強したりするのが好きなので、これからもどんどんレベルアップして行きます。

結構個人的な記事にはなりましたが、初学者や未経験の方、独学をしている方の参考になれば幸いです。

では〜。