Media Sneakers

概要

• 作品名 オリジナルWordPressメディアサイト
• 担当範囲 コーディング / WordPress化
• 制作期間 1週間

制作の背景・目的

現在のWeb制作案件で最もニーズの高い「デザインカンプ（Figma）からのコーディング」、そしてそれをクライアント自身でお知らせや記事を更新できるようにする「WordPress（独自テーマ）化」のスキルを証明するために制作しました。実務のフローを完全に再現し、1週間という短期間でモックアップから動的なサイトへと昇華させることに挑戦しました。

工夫した点・こだわったポイント

• 更新性の高いWordPress設計 ただサイトをWordPressに移行するだけでなく、クライアントが直感的に記事の投稿や管理ができるよう、管理画面の使いやすさやカスタムフィールドの配置に配慮して設計しました。
• デザインの完全再現 Figmaで作成された元のデザインデータから、文字組み、余白、カラーコードを正確に抽出し、Webブラウザ上でもそのクオリティが100%再現されるよう、丁寧なコーディングを徹底しました。

苦労した点と解決策

• WordPress化に伴うCSS（スタイル）の崩れ 静的なHTML/CSSの段階では完璧に表示されていたものが、WordPressのテンプレートへ組み込み、PHPのコードへ置き換えたタイミングで、予期せぬスタイルの崩れ（表示のバグ）が発生し、原因の特定に苦労しました。
• どうやって解決したか ブラウザのデベロッパーツールを活用して、WordPress特有のクラス名やタグの出力、パスの通リ方などを徹底的にデバッグしました。読み込み順序やCSSのバグを一つずつ丁寧に解消したことで、デザインを一切崩すことなく動的なシステムへと完全移行させることができました。

提供できる価値

Figmaからの実装、そしてWordPress化までを1週間で完結できるため、ブログ機能やNews機能がついた本格的なサイト構築をスピーディに対応可能です。さらに、私は動画編集スキルも持っています。例えば、メディアサイト内に埋め込むアイキャッチ用のリール動画や、記事に連動したYouTube動画の編集・制作まで一括してお引き受けできます。テキスト、デザイン、動画を掛け合わせた、訴求力の高いメディアサイトの運用をご提案いたします。