春陽が心地よい季節になって参りました。

markup engineer / web designer
Scroll
HTML・CSS・SCSS・jQuery(JS)・PHP等で
コーディングが可能です。
Adobe XD・Adobe PhotoShop等で
WEBデザインが可能です。
最適なタグ構成・サイトスピード
構造化マークアップ等でSEO対策が可能です。
新規サイトのデザイン・コーディングをご依頼頂きました。
概要:採用を強化したいため、採用専用サイトを作って弊社の良さをアピールし、応募に繋げたい。
・ワイヤーフレーム制作
・デザイン(スマホ特化型)
・WordPress設計、構築
・ブロックエディタ構築
・PHPコーディング
・マークアップSEO
既存WordPressのビジュアル調整と二言語化をご依頼頂きました。
概要:サイトに見にくい部分があるので修正したいのと、海外向けアプローチの為にサイトを二言語化したい。
・ビジュアル調整、リダイレクト等
・WordPressの二言語化の設計、構築
・Google Search Consoleの導入
以前制作依頼を頂いたサイトのリニューアルをご依頼頂きました。
概要:事業拡大に伴い小規模だったサイトを中規模にリニューアルし、SEOにもアプローチしたい。
・WordPress設計、構築
・PHPコーディング
・ブロックエディタ構築
・JSアニメーション
・マークアップSEO
新規サイトのコーディングをご依頼頂きました。
概要:新サービス展開に伴い、専用サイトを制作し、サービスの内容や周辺情報などを掲載し、問い合わせの入口にしたい。
・デザインに忠実なコーディング
・アニメーションライブラリでアニメーション実装
・マークアップSEO
サイトリニューアルのWordPress化をご依頼頂きました。
概要:WEBサイトの保守性やSEOなど総合的に考えた結果、リニューアルしたいとなった。
編集しやすいようにほぼ全てをブロックエディタで構築を実現。
12月にご依頼頂いて年始すぐに公開ができ、「すごくスピーディーだった」と大変喜んで頂けました。
・WordPress設計、構築(オリジナルテーマ)
・PHPコーディング
・ブロックエディタ構築
・マークアップSEO
海外向けLPの制作をご依頼頂きました。
テーマに沿った形でデザイン~構築まで担当させて頂きました。
概要:昨今のインバウンド需要に対応するべく海外向けにアプローチしたく、海外向けLPが欲しいとなった。
・デザイン全般
・WordPress設計、構築
・PHPコーディング
・ブロックエディタ構築
既存サイトのリニューアルをご依頼頂きました。
概要:不具合の多いサイトだった為、これを機に、LP風にリニューアルしたい。
デザイン~WordPressの設計から構築までを担当させて頂きました。
先方でもある程度の編集ができるようにブロックエディタで構築。
デザイン面で大変喜んで頂き、「私の好きなデザインです」と有り難いお言葉が頂けました。
・デザイン全般
・WordPress設計、構築
・PHPコーディング
・ブロックエディタ構築
・ライティング
・マークアップSEO
サイトリニューアルのコーディングをご依頼頂きました。
概要:サービスサイトと記事サイトを分けて運用しているが、2つのサイトを統合したい。
・WordPress設計、構築(テーマ使用)
・PHPコーディング
・CSS
◆ご依頼者様の声
「丁寧に対応していただけるのでオススメです!」
新規サイト制作をご依頼頂きました。
概要:事業拡大に伴い、サービスサイトが必要になった。
WordPressテーマをカスタマイズし、
頂いたワイヤーフレームから構築。
・WordPress構築(テーマ使用)
・PHPコーディング
・CSS
・マークアップSEO
WIX→WordPressのリニューアルをご依頼頂きました。
概要:現状のサイトが安っぽいので、WordPressでかっこよくリニューアルしたい。
・WordPress構築(テーマ使用)
・CSS
・マークアップSEO
WIX→WordPressの移行をご依頼頂きました。
概要:WixでHPを作成しましたが、別件でドメインを契約したので、これを機にWordPressに移行をしたい。
・WordPress構築(テーマ使用)
・ブロックエディタで実装
・CSS
・マークアップSEO
新規採用サイトのコーディングをご依頼頂きました。
概要:社内リソースが足りないのでコーディングをお願いしたい。
・WordPress設計、構築(オリジナルテーマ)
・PHPコーディング
・CSS
・マークアップSEO
「最低限のサイトを全部お任せで!」とご依頼を頂きました。
ご依頼者様の好きなカラーと事業内容・雰囲気からデザインを考え、制作致しました。
環境 : HTML5 CSS3
制作期間 : 3日
「Wordpressのテーマをベースに、サイトを作ってほしい」とご依頼を頂きました。
簡単なデザインを頂いて、テーマに無いデザインや機能は独自に作成して実装しました。
高品質なテーマを使用したのでご満足頂けました。
環境 : HTML5 CSS3 WordPress PHP
制作期間 : 2週間
新規サイトリニューアルをご依頼頂きました。
概要:サイトが安っぽくコンテンツも少ないのでリニューアルして存在感を出したい。
・WordPress構築
・二言語対応
・PHPコーディング
・CSS
・マークアップSEO
PC用のサイトのレスポンシブデザインのご依頼を頂きました。
環境 : Figma
制作期間 : 2日
予算を抑えてのご依頼だった為、テンプレートを使用し、
テキスト変更・お好みのカラー変更で構築致しました。
ボリュームとしては小規模ですが、それまでHPが無かったため、大変喜んで頂けました。
PHPでのコーディング・CSS・SSL化・最低限のSEO対策
・Googleビジネスアカウント開設~検索登録。
環境 : HTML5 CSS3 PHP
制作期間 : 約二日
こちらはデザインポートフォリオです。
ロゴから全てデザインしました。
フィットネスなのでメインビューに動きをつけたかったのですが、悩みに悩んだ末に
角度をつけたレイアウトで解決しました。
環境 : Photoshop XD
オリジナルテーマ制作
サイトのコーディング・レスポンシブを担当。
構造化マークアップでのSEO対策やAjaxLoadingを実装。
環境 : HTML5 CSS3 JS PHP WordPress
制作期間 : 2週間
オリジナルテーマ制作
ターゲット : 20~30代女性
ベースカラーが青な為、色味を少し青寄りに。
※レイアウトのベースはアーバンクア制作時のテーマを使用。
環境 : HTML5 CSS3 JS PHP WordPress
制作期間:1.5ヶ月
チーム : 3人
オリジナルテーマ制作
ターゲット:20~30代女性
ベースカラーが青な為、色味を少し青寄りに。
※レイアウトのベースはアーバンクア制作時のテーマを使用。
環境 : HTML5 CSS3 JS PHP WordPress
制作期間 : 1.5ヶ月
チーム : 3人
オリジナルテーマ制作
ターゲット:20~30代女性の家族連れ
課題 : 旧サイトが更新し辛く非効率、リニューアルして顧客が求める情報をわかりやすく整理したい。
解決策 : 暖かい色みでWPブログ機能で更新しやすく・デザインはわかりやすく見やすい形に実装。
環境 : HTML5 CSS3 PHP JS WordPress
制作期間:1.5ヶ月
チーム : 3人
オリジナルテーマ制作
既存サイトのWordPress化を前任者から引き継ぐ形で制作致しました。
iframeを作成し、こちらのサイトを更新するだけで系列サイトも自動的に更新されるように実装。
環境 : HTML5 CSS3 PHP JS WordPress
制作期間:1.5ヶ月
チーム : 2人
オリジナルテーマ制作
ワイヤーフレーム案とWordPress構築、SEO対策を担当しました。
課題 : 所有する大量のYoutoube動画を一つのサイトで見れるようにしたい。
解決策 : 全ての動画を集約し、モバイルファーストレイアウトで
トップページに動画を多数配置してアクセスしやすい形に。
各一覧もAjaxLoading(もっと見るボタン)でページ内に読み込めるように。
環境 : HTML5 CSS3 PHP JS WordPress PhotoShop
制作期間 : 1.5ヶ月
チーム : 3人
新規サイトのコーディングを担当
レスポンシブからアニメーションまで制作しました。
環境 : HTML5 CSS3 JS
制作期間 : 1ヶ月
チーム : 2人
オリジナルテーマ作成
予算に合わせてのコーディングとSEO対策、ブログ機能でご提供。
極力無駄を削ぎ落とし、レスポンシブはBootstrapを選択。
WordPressのブロックエディタで編集できるようにしてほしいという要望通りに実装。
環境 : HTML5 CSS3 JS
AppleWatch関連商品のプレビューサイト構築・コーディングを担当
WordPressの簡単なプラグインを制作し、管理画面で色の変更をできるように実装。
環境 : HTML5 CSS3 JS PHP WordPress
制作期間 : 1週間
チーム : 2人
オリジナルテーマ制作
新規サイトのコーディングを担当し、アニメーションを含めたほぼ全ページを制作。
WordPressの構築やSEO対策も実施。
環境 : HTML5 CSS3 PHP JavaScript WordPress Photoshop
制作期間 : 1.5ヶ月
チーム : 3人
オリジナルテーマ制作
サイトリニューアルのコーディングを担当し、既存サイトからの移設作業やほぼ全ページを制作。
WordPressの構築やSEO対策も実施。
環境 : HTML5 CSS3 PHP JS WordPress Photoshop
制作期間 : 1.5ヶ月
チーム : 3人
ロゴデザインからコーディングまで制作
ロゴデザインやフォントの選択が難しかったです。
環境 : HTML5 CSS3 JS Photoshop Illustrator XD
チーム : 1人
新拠点のページ制作や更新保守業務を担当
新規拠点ページ5~10ページやファーストビュー画像の編集等をしておりました。
環境 : HTML5 CSS3 JS PHP WordPress PhotoShop
チーム : 2人
コーディング・レスポンシブを担当
まだコーディング経験が浅い時期だったので、効率的なマークアップやFlex-boxの使い方に苦労していて、仕様や挙動を模索しながらコーディングしていました。
環境 : HTML5 CSS3 PhotoShop
制作期間 : 2週間
チーム : 2人
トップページと2つのサブページをフルコーディングとレスポンシブを担当。
アニメーションや斜めのレイアウトを用いて、WEBページに動きと個性を与えました。
環境 : HTML5 CSS3 JS
制作期間 : 3週間
チーム : 3人
最初に作ったポートフォリオです。
環境 : HTML5 CSS3 JS
FutureShop、楽天、Yahoo、WowmaなどのECサイト運営全般の業務に携わっておりました。
季節に応じた販促ページや商品のLPを企画したり、ショップのUIやUXを改善することでコンバージョン率を高めています。
また、チャットボットの内容を改善したり、レコメンド機能を導入したりすることで、顧客満足度やリピート率も向上させています。
レコメンド機能の導入では、繁忙期のCVRが12%に達するという成果を出しました。
環境 : HTML5 CSS3 JS Photoshop Illustrator Dreamweaver
チーム : 2人

製作期間:約2ヶ月
コンセプト:①図形、②多色、③単ページ、④インタラクティブなアニメーション
デザインの最小単位として図形や多色をモチーフにし、
必要な情報までのクリック数を極力減らしたかったので単ページ構成にし、
なおかつ見る人が楽しめるようにインタラクティブなアニメーションを実装。
最近トレンドのAIについても記述しています。
WordPressにて実装し、制作事例とブログ部分は投稿出来るようにしています。
使ってみたかったWebGLも実装出来たので良かったです。
AIの発展が目まぐるしいですね。WEB制作で言うと、
今では静的コーディングの多くをAIが担ってくれるようになりました。
「AIによって人間のやることが減っている」一見するとそう思います。
ここからの時代はAIと共生し、
「何をどうやって共創していくのか」
「提示された手段の中から何を顧客へ提案するのか」
「AIが出したコードをどのように組み込めばバグが起こらないのか」
「ターゲットに刺さるビジュアルにするにはどこを変えれば良いのか」
「AIを使いこなすには何を自分で勉強すれば良いのか」
そこを考えられる人材が重宝されると感じます。
AIを使うのは簡単です。
ただAIをコントロールするのは自分であり、正しい意思決定をする必要があります。
意思決定をする判断材料となるのは「膨大なデータ×人間の経験」でしかなく、
それはこれまでと同じです。
今の時代こそ基礎を大事にするクリエイターでありたいです。