about
液晶ガラス・光学ガラスの製造加工会社で約20年間の会社員生活をしてきました。
その間、インフルエンザにかかってしまった以外は一日も仕事を休むことが無く勤めてきました。社内でも「絶対に会社を休まない男」といわれていて、そのことが自分の中での自信でした。しかし、持病の腰痛が悪化し歩くことも困難な状態になってしまい治療に専念することになり退社。
その後の長い治療期間中にプログラミングに興味が湧きExcelVBA・HTML・CSS・javaScriptを独学しました。
腰の状態も良くなり第二のスタートとしてwebデザイナー養成の職業訓練校に入校。本当に出会えて良かったと思える先生、仲間と共にIllustrator・Phtoshop・xd・WordPressも学びました。
今までの仕事で、0.1mmの小さな誤差を調整して製品を作っていたこともあり、レイアウトのずれなどが人一倍気になるところがあるのでデザイン面で良い方向に活かせればと思います。
works
K.H portfolio
卒業後に制作した、このポートフォリオです。
冒頭はフラッシュアウトまでをAfter Effectsで、その後はjQueryで制作しました。
フォームはStatic Formsを使用しています。
SSL対応・メール送信完了ページのリダイレクトやAfter EffectsからjQueryへの連携などは初めての実装だったので勉強しながらの進行でした。
冒頭のダークカラーで動きを大きく、ホワイトバックからは動きを抑えて、フラッシュアウトの前後の対比を意識して作りました。
HTML・CSS・jQuery・Illustrator・Photoshop・After Effects・xd・Static Forms
eve.eye
卒業後の制作作品です。
メガネフレームメーカーのwebサイトのリニューアルという設定です。
今季の新作アイテムの紹介ページというていのものです。
リニューアルということで既に認知度がある設定でしたので、写真をメインに印象付けるために説明文は最小限にとどめ、メーカーロゴの2色を基調に、シンプルに作るように心掛けました。top画像でインパクトを出したかったので、まずはブラックバックにロゴだけを書き出し黒と金だけの時間を多めに、その後に写真が大きく現れるような動きを付けました。lottieを使いましたがmp4ではなくjsonで実装すると反映の範囲に制限があって使えない表現が多く苦労しました。
HTML・CSS・JavaScript・jQuery・Illustrator・Photoshop ・After Effects・lottie・xd
IMFデンタルクリニック
卒業制作の作品です。
落ち着いた雰囲気と高級感で差別化をはかっている審美歯科の新規サイト立ち上げの設定です。
HOME、治療科目、ホワイトニングのページを制作しました。
高級感を特徴とした審美歯科なのでレイアウト崩れをおこさないようにブレイクポイントを３つに設定し、ホワイトとゴールドと余白の広さを意識して配置しました。
jQueryを使わずJavaScriptだけで制作してみました。
HTML・CSS・JavaScript・Illustrator・Photoshop・xd
K.H portfolio 別パターン
このポートフォリオの冒頭のアニメーションを変えたものです。
フラッシュアウトまでの部分をAfter Effectsで作りなおしました。
勉強中なので頭の中の構想を実現することに時間がかかりましたが、だいぶ思い描いていたものに近い感じに出来ました。こちらは遊び心を加えて人気アニメーションのパロディーを入れたもので、私の物静かなポートフォリオが出てくるまでの対比として話の流れもあるように意識して作りました。
After Effects
cafe&flower
授業の課題作品です。
HTML・CSS・jQuery・Illustrator・Photoshop
contact
下記フォームよりご記入ください。必須の項目は必ずご記入お願いいたします。