テクノロジー

ポートフォリオサイト(2代目)を作りました

Kana🐥UGOK's icon'
  • Kana🐥UGOK
  • 2021/08/23 15:09
Content image

 

 

こんにちは、kanaです。

 

ポートフォリオサイトを実際に企業の人に見せるということを考えると、1代目のままじゃ出せない!と思ったので、夏休みに入ってから2代目を作ることにしました。

 

※ 1代目のポートフォリオについてのブログはこちら

 

2代目を作るにあたって改善しようと思った点

まず1代目は、他人に見せるということを特に意識せず作成したということと、デザインの勉強を始める前だったということもあり、いくつか気になる点がありました。

🔹全体の背景が青いのが、作品の見え方に影響しそう

🔹イラストを描くのが好きなことよりも、写真を撮るのが好きということをアピールし方がよさそう

🔹CONTACTページいらないかも

自分の好きなかわいい雰囲気で作ったので、1代目のデザインが嫌いというわけでは無いのですが、企業の人には見せられない…と思ったので作り直しました。

 

2代目ポートフォリオサイト

制作時間:約2週間

Content image

こんな感じになりました。

ネコですね…。

本当は自分がオシャレに写った写真にしようかと考えていたのですが、こんな時期なので撮りに行くのも難しく諦め。

 

ページとしては、topページ、aboutページ、workページ、blogページで構成されています。

 

🐈|topページ

Content image

 

各ページの一部をトップに置き、そこから飛べるようになっています。

 

工夫点

🔸背景は白

🔸シンプルデザインだけど、学生だと伝わるポップさも足した

🔸写真が趣味だということを伝えるためにトップに置いた

🔸レスポンシブしやすいように、flexを解除するだけでよさそうなデザイン

 

トップの写真をスライドにしたり、開くたびに違う写真に変わったりと、いくつもの写真が見せられるように出来たらいいなと考えています。

 

🐈|aboutページ

Content image

 

簡単に自分の頑張ってることを、まとめました。

ここでは、スキルよりも人柄が伝わりそう(?)なことを書きました。

 

工夫点

🔸基本箇条書きで、じっくり読み込まなくても内容が入ってくるようにした

🔸写真も角丸の枠をつけて雰囲気を統一

 

他人が写っている写真は既にネット上で使っているものを選ぶようにしました。

 

🐈|workページ

Content image

まだまだ少ないですが…。

 

工夫点

🔸一部ですが、サムネイルを作って見やすくした

🔸その作品が何かわかりやすいようにタイトルの下にジャンルを書いた

 

各作品をクリックすると、こんな感じ

 

Content image

本当はもっと詳細に過程など書いた方がいいんだろうな~と思いつつもこのような形になりました。画像のサイトは1ページですが、複数ページのものは全ページのスクショを貼るようにしています。

 

工夫点

🔸背景が白の作品だと埋もれてしまうので、詳細ページは色を変更

 

🐈|blogページ

Content image

 

これからブログも増えるかな~と思って、ブログページも作りました。

 

工夫点

🔸workページと同じデザインにして統一

 

素材について

このサイトのロゴマーク的なイラストを作成しました。

Content image

 

ステッカー風のつもり…。

Illustratorで作成しました。

 

Content image

 

連絡はDMへと全ページで案内しているイラスト。

Procreateを使用して描きました。

ちなみに魚が本体です。

 

Content image

aboutページで使用しているこのイラストは、1代目ポートフォリオで使用していたイラストを持ってきました。

 

最後に

なんとか形になってよかったなと思っています。

作品がまだまだ充実していませんが、これからどんどん増やしていきたいです。

 

ポートフォリオサイトはこちらから

 

これから手直ししたい点

🔹今のままでもいいかなと思いますが、フォントを変更したい

🔹作品詳細ページのスクショが下に偏ってるので、上揃いにしたい

 

これからも改善点とか増えていくかと思うので、ブラッシュアップしていけたらなと思います。

 

ここまで読んでいただきありがとうございました。

 

 

 

 

Article tip 0人がサポートしています
獲得ALIS: Article like 70.77 ALIS Article tip 0.00 ALIS
Kana🐥UGOK's icon'
  • Kana🐥UGOK
  • @HMDKN

投稿者の人気記事
コメントする
コメントする
こちらもおすすめ!
Eye catch
クリプト

Bitcoinの価値の源泉は、PoWによる電気代ではなくて"競争原理"だった。

Like token Tip token
59.32 ALIS
Eye catch
テクノロジー

オープンソースプロジェクトに参加して自己肯定感を高める

Like token Tip token
55.05 ALIS
Eye catch
テクノロジー

iOS15 配信開始!!

Like token Tip token
7.20 ALIS
Eye catch
クリプト

Uniswap v3を完全に理解した

Like token Tip token
18.92 ALIS
Eye catch
クリプト

Bitcoin史 〜0.00076ドルから6万ドルへの歩み〜

Like token Tip token
947.13 ALIS
Eye catch
クリプト

約2年間ブロックチェ-ンゲームをして

Like token Tip token
56.20 ALIS
Eye catch
クリプト

ブロックチェーンの51%攻撃ってなに

Like token Tip token
0.00 ALIS
Eye catch
他カテゴリ

ALISのシステム概観

Like token Tip token
5.00 ALIS
Eye catch
クリプト

ジョークコインとして出発したDogecoin(ドージコイン)の誕生から現在まで。注目される非証券性🐶

Like token Tip token
38.31 ALIS
Eye catch
他カテゴリ

機械学習を体験してみよう!(難易度低)

Like token Tip token
69.82 ALIS
Eye catch
クリプト

17万円のPCでTwitterやってるのはもったいないのでETHマイニングを始めた話

Like token Tip token
46.60 ALIS
Eye catch
テクノロジー

彼女でも分かるように解説:ディープフェイク

Like token Tip token
32.10 ALIS