akiko shibutani
web coding
Portfolio.
work.
Study cafe-ME-（架空） open_in_new
自主制作。メニューとNewsはWordPressで最新の情報を簡単に更新できるように設定しました。
【設計】
TOP+下層４ページ
【実装】
・ブログ投稿
・予約フォーム（プラグイン使用）
・OGP設定、各ページのtitle、metaﾀｸﾞ設定（プラグイン使用）
・アニメーション
・カスタム投稿（プラグイン:ACF）
TETOTE（架空） open_in_new
課題制作。デザインカンプからのコーディング。エントリーフォームはTabで移動しつつキーボードだけで完結できるようにアクセシビリティ対応
【設計】
TOP+下層10ページ
【実装】
ブログ投稿
・フォーム（プラグイン:MW WP Form）
・カスタム投稿（プラグイン:ACF）
・サイドバーのアクティブ表示
・フォームアクセシビリティ
・各ページのtitle、metaﾀｸﾞ設定（プラグイン使用）
・アニメーション
・カード（その他のメンバー）ランダム表示
Insure Partners（架空） open_in_new
課題制作。デザインカンプからのコーディングおよびオリジナル化。パスワードは入力文字がわからないように設定。フォームはは必須項目が入力されていない場合はボタン非活性などを実装。
【設計】
TOP+下層6ページ
【実装】
・ローディング
・エントリーフォーム（googleフォーム）
・モーダル
蓼科ごとう農園（架空） open_in_new
課題制作。デザインカンプからのコーディング。製品一覧はスワイパーで実装。
【設計】
TOPページのみ
【実装】
・ハンバーガーメニュー
・アコーディオン
・Swiperによるスライド
・フォームの送信（googleフォーム）
・ローディングアニメーション
skill.
WordPress
オリジナルテーマでの作成。ブログ投稿、カスタムフィールドを使用したカスタム投稿、フォーム機能等実装可能。
HTML
適切なマークアップによるWebページの構築。SEOを意識したコーディングに対応。
CSS
レスポンシブ対応やアニメーションの実装、BEM設計を用いた管理しやすいスタイル設計が可能。
Sass
CSSのカスタムプロパティやSassの機能（変数、mixin、@extend など）を活用した効率的なコーディングに対応。
jQuery
jQueryを使ったアニメーションやインタラクションを追加が可能。 ハンバーガーメニューやアコーディオンメニューのカスタマイズなどに対応。
Photoshop
画像の切り抜きや加工、 バナーやSNS画像の作成が可能。
Illustrator
ロゴ作成、 SNS画像・ECサムネ画像の作成が可能。
Figma
簡単なデザイン作成、カンプからの読み取りコーディングが可能
Dreamweaver
コーディング、テンプレート作成と活用が可能
Premiere pro
動画の編集、エフェクト追加。動画と静止画を合わせた広告クリエイティブの作成が可能。
about.
SEOを意識し、デザインに忠実に、丁寧にコーディングし、ご要望は柔軟に対応いたします。
contact.
Akiko
Shibutani
shibutani.ak@gmail.com