Cofe Shop Menu
マウスオーバー時のアニメーションやページ内リンク、背景の固定表示など、基本的なコーディングを学習しました。見本に忠実に再現しつつ、テキストシャドウなどで視認性を向上させています。
未知の創造をカタチにする
Concept
制作意図
このポートフォリオは、WEBコーダーとしてのスキルと、自分
のアイデアを『カタチ』として表現する為に制作しました。
Theme
世界観
『荒廃×サイバー』をテーマに、生成AIで作成した背景を用い、
世界観に合ったUIデザインやユーザー体験を追求しています。
Create
創造性
オリジナルのアニメーションやスクリプトを設計し、スマホ版
では専用の別デザインに切り替わるなど、細部まで拘りました。
Concept
制作意図
このポートフォリオは、WEBコーダーとしてのスキルと、自分のアイデアを『カタチ』として表現する為に制作しました。
Theme
世界観
『荒廃×サイバー』をテーマに、生成AIで作成した背景を用い、世界観に合うUIデザインやユーザー体験を追求しています。
Create
創造性
オリジナルのアニメーションやスクリプトを設計し、スマホ版では専用の別デザインに切り替わるなど、細部まで拘りました。
My Work
Code-Jump様の模写課題を、シンプルな初級LPからJavaScriptアニメーションを含む上級LPまで全て制作しました。単なる模写ではなく、見やすさやコードの整合性を意識して取り組んでいます。
UI Design
初期デザインのUIやアイコンは、テンプレート的な見た目で、世界観にマッチしていませんでした。
UI Design
オリジナルのデザインを設計し、世界観を更に補強。 情報の読みやすさも両立させました。
User Experience
制作サイト紹介では模写サイトだけなので、インパクトが無く興味を引きにくい構成でした。
User Experience
マウスオーバーでサイト全体図と説明文が展開するよう再設計。 模写のみの弱さを演出に変え、ユーザー体験へと昇華させました。
Visual Detail
画像素材はAI生成で用意しましたが、不自然さや邪魔な要素があり、雰囲気を損ねていました。
Visual Detail
Photoshopで加工修正や色彩調整などを行い、世界観に合った、統一されたビジュアルに改善しました。
NEXT
Takuj Ito
／
伊藤卓爾
静岡県出身。
WEB制作スキルを一通り学び、現在はCMS関連やデザインの学習に取り組んでいます。
趣味はファッションや「カッコイイ」と感じるもの全般で、廃墟やサイバー系の世界観に惹かれます。
このポートフォリオはそういった『自分だけのアイデアをカタチにしたい』という想いから、コンセプト・デザイン・演出等を全て０から設計、唯一無二のオリジナリティ溢れるサイトに仕上げています。
(背景イラストは時系列のストーリーになっています)
制作・実装においては何度も壁に当たりましたが、学習で培ってきた『自分で問題を乗り越えるチカラ』を活かして完成させました。
今回の経験を活かし『クライアントのアイデアをカタチにする』WEBコーダーとして成長していきます。