Figma
ポートフォリオや架空カフェサイトのデザインカンプ制作に使用しています。ワイヤーフレームに基づいた正確なレイアウト制作に加え、現在は効率的な運用のための「コンポーネント化」や「色・フォントのスタイル管理」を学習・実践しています。修正に強く、コーディング工程へスムーズに移行できるデータの構築を意識して取り組んでいます。
design
Webサイトやバナーを制作することができます。デザイン4原則に基づいた、見やすく整理されたレイアウトを基本とし、そこに厨房設計で培った「ユーザー視点」を掛け合わせ、意図が正しく伝わる使い勝手の良いデザインを心がけています。
Photoshop
Webサイトに使用する写真のレタッチや合成、バナー制作に使用しています。写真の明るさ・色味の補正といった基本的なレタッチに加え、レイヤーマスクを用いた画像の切り抜き・合成が可能です。現在は、制作スピードの向上に加え、再編集を容易にするスマートオブジェクトの活用など、より実務的なワークフローの習得を意識して取り組んでいます。
Illustrator
Webサイトで使用するロゴやアイコンなどのベクターデータの制作に使用しています。パスファインダーを用いた図形の合成や、基本的なパス操作によるパーツ制作が可能です。現在は、拡大・縮小しても画質が劣化しないベクターデータの特性を活かし、SVG形式での適切な書き出しや、より効率的なパスの描き方を意識して取り組んでいます。
coding
設計図を正確に読み取り、デザインを忠実に再現します。後々のメンテナンスを考慮し、規則性のある整ったコードを書くことを大切にしています。
HTML / CSS(Sass)
Web標準を意識したセマンティックなHTML記述と、Flexboxを活用した柔軟なレイアウト構築が可能です。メディアクエリを用いたレスポンシブ対応はもちろん、JavaScriptと連携した動的なUI（タブ切り替えやアニメーション）の実装も行っています。現在はSassを導入し、変数管理やネストを活用した、より保守性の高い修正に強いコーディングを実践しています。
JavaScript / jQuery
Webサイトに動きを加えるための基礎的なJavaScript（Vanilla JS）、jQueryを習得しています。ポートフォリオでは、addEventListener や dataset を活用し、各セクションが独立して動作するタブ切り替え機能などを自力で実装しました。現在は、より効率的で読みやすいコードの書き方や、再利用性の高い関数設計について、実践を通じて学習を深めています。
PHP / SQL
Webサイトに動的な機能を実装するためのPHPの基本文法（変数、配列、ループ処理、関数）および、データベース（SQL）の基礎知識を習得しています。フォームからのデータ受け取りや、条件に応じたコンテンツの出し分けなど、バックエンドの基本的な仕組みを理解しています。現在はこれらの知識を応用し、WordPressの学習や、データベースを活用した効率的なコンテンツ管理の実装に向けて学習を深めています。
development
チーム開発や効率的な制作を可能にするツールを導入しています。常にモダンな開発フローを意識した環境構築を行っています。
Git/GitHub
Sourcetreeを活用し、制作プロセスの履歴管理およびGitHubへの公開を行っています。基本的なプッシュ・プル操作に加え、ブランチを用いた機能ごとの並行開発や管理が可能です。現在は個人開発においても、本番用と作業用ブランチを分けた安全なワークフローを実践しています。今後は、チーム開発におけるプルリクエストの活用や、コンフリクトを未然に防ぐ運用の習慣化を目標としています。
Tools
VS Codeをメインエディタとして使用し、拡張機能を活用したミスのないスピーディーなコーディングを実践しています。また、ブラウザのデベロッパーツールを用いたリアルタイムでのデバッグやレスポンシブ検証を習慣化しており、PHP等の動作確認にはXAMPPを用いたローカルサーバー環境を構築しています。将来的には、ターミナル操作やパッケージマネージャー（npm等）の導入など、より実務的なモダン開発環境の習得も視野に入れて学習を進めています。
get in touch / contact me / get in touch / contact me /
get in touch / contact me / get in touch / contact me /
