こんにちは、Ziziです。
僕はプログラミングを始めて3ヶ月後には自分のポートフォリオサイトを制作していました。
【ついに完成しました！】
プログラミング始めて
３ヶ月目なんですけど、これくらいは０から作れるようになりました！
ただ、めちゃくちゃサイトが重いですw
Google先生からの改善策を読んでもよくわからない。(勉強しなきゃ。。。)
このサイトで明日から営業するぞー！！https://t.co/W6NRQNAagH— Zizi@🇯🇵北海道🇯🇵 (@ZiziNomad) 2018年8月19日
こういった疑問にお答えします。
✅本記事の内容
・ポートフォリオサイトの作る方法
・Photoshopなどのデザインツールは必須ではない
・ポートフォリオは知名度のないフリーランスが仕事をもらうための唯一の武器である
本記事ではこれらをまとめました。
それでは具体的にその手順を解説していきます。
Contents
デザインができないエンジニアがポートフォリオサイトを作る方法
①日頃からおしゃれなサイトを見つけたらブクマに保存
②ポートフォリオサイト作る時に参考サイトを再度見る
③そのサイトたちの気に入った部分をマネする
④サイトを元に大まかなレイアウトを紙に描く
⑤コーディングしながらデザインする。
①日頃からおしゃれなサイトを見つけたらブクマに保存
僕はWEB制作をする時には必ずPinterestを見ます。
例えば、Pinterestで【Web Design】と検索してみましょう。
イケてるサイトはpinterestなどで探せばOK。
この中から自分が気に入ったデザインを保存して、
自分が作りたいサイトのイメージを膨らませていきます。
参考サイトをどんどん増やしていく感じです！
②ポートフォリオサイト作る時に参考サイトを再度見る
僕が初めて作ったポートフォリオサイトはこちらでして、(画像クリックで飛びます)
制作するにあたって参考にしたサイトは以下3つです。
③そのサイトたちの気に入った部分をマネする
いずれも僕のサイトを見てもらえればわかると思うのですが、
具体的には上記３サイトのトップページのインパクト、ロード画面の動き、そして縦書きの表現を真似しました。
色んなサイトを見て、自分が気に入った場所をうまく自分のポートフォリオサイトに組み込むイメージです。
④サイトを元に大まかなレイアウトを紙に描く
①〜③の工程で自分の頭の中でサイトのイメージができあがってきたと思います。
次はそのイメージを紙にざっとレイアウトを書き出します。
雑すぎて参考になるかはわかりませんが、
こういう感じで大雑把にイメージを書き出します。
⑤コーディングしながらデザインする
こんなことをするとデザイナーさんに怒られるかもですが、
レイアウトがなんとなく決まったら、あとはコーディングしながらデザインします。
理由としては、１からデザインツールの使い方から覚えなければならないからです。
デザインしてからの方が圧倒的に楽ですが、その分圧倒的に時間がかかります。
１，デザイン→コーディング→サーバーアップロード
２，コーディングしながらデザイン→サーバーアップロード
こうすることで３ステップではなく２ステップで完成します。
特にデザインを苦手にしている人は”デザイン”の過程でまず挫折します。
ゴールはポートフォリオサイトを完成させることであって、
デザインツールを使えるようになることではありません。
最短距離でポートフォリオサイトを作るためにデザインツール必須ではないので、
デザインができないからといって諦めなくて大丈夫です！
「自分のポートフォリオサイトを作った方が良い」と、
何度も聞いたことがあると思うんですけど、それでもほとんどの人が作れないし、見せられません。
だからそこには大きなチャンスがあります。
ぶっちゃけポートフォリオサイトを自分で作ることができれば就職は余裕だと思います。
作れない人がほとんどだからですね。
「未経験」だったらなおさら、そこで勝負しましょう！
まとめ：まずは最低限の実績を作る
自分が現時点で作れる最高のwebサイトを作ろうね！
ポートフォリオサイトを作ったおかげでクライアントからの食いつきがよかったですし、その方が相手からも信頼されやすいです。
身元もよく分からないフリーランスの仕事の質を保証してくれるのは「制作実績」だけだからです。
ある程度までポートフォリオが完成したら、仕事を請けつつ掲載作品数を増やしていけばOKです。
Progateでレベル上げしている暇があったら
学んだことですぐにアウトプットするために自分のポートフォリオサイトを作りましょう。
その方が圧倒的に成長効率はいいです。
ポートフォリオサイトを作るときの参考になれば幸いです^^
※追記
テンプレートファイルを販売して欲しいという声が多かったので販売することにしました！
基本的にHTML/CSSの知識がある人向けですが、
わからない場合は、オプションでカスタマイズをお手伝いすることも可能です。
その場合は、別途ご相談していただければお見積り致しますので、お問い合わせページ、もしくは僕のTwitterまでご連絡ください^^
もし、ポートフォリオサイトで気に入るデザインがなければ、是非僕のデザインを使ってください^^
SNS上では日々マウントを取ったり、誹謗中傷、炎上。
疲れませんか？
こういった情報は果たして自分にとって大切で自分の人生に必要でしょうか？
実際にSNSを辞めて1年以上経ちますが、当然実生活には何の問題もありません。
もう数時間前に自分が投稿した内容について、揚げ足を取られる心配はありません。
余計な情報が入ってこないので、自分の人生に集中できます。
SNSは「繋がり」は広げてくれますが深めてはくれません。
そんな中で僕はSNSを辞めて、限られた少ない「繋がり」の中で、「繋がり」を深めていきたいと思うようになりました。
そのためのツールとして適しているのがメールマガジン。
世界情勢から海外移住、海外起業、フリーランスや海外ノマド事情まで、SNSやブログではなかなかお話しできない内容を私見たっぷりにお伝えいたします。
アフターSNSの世界へようこそ。
