OEM木工製品ブランド「G.P.WOODWORK」様のコーポレートサイトにて、TOPページ・OEMページ・製品実績ページのリニューアルを担当しました。職人の技と木の温もりが伝わるよう、信頼感を軸にしながらも、柔らかさや親しみやすさを感じられるデザインに。特にOEMサービス紹介と製品実績では、写真・配色・余白にこだわり、丁寧なものづくりの魅力が直感的に伝わる構成を心がけました。 Design mockup (Figma) : https://www.figma.com/design/NBNPmMRi2WxxgSlEFenIjC/G.P.WOODWORK?node-id=0-1&t=nWHqMCFgEQeoWe1A-1

ターゲット

木製製品のOEM制作を検討している法人・団体の担当者、またはバイヤー

目的

OEM製造の依頼や相談につなげるために、製品の品質や実績、企業としての信頼性を、デザインと情報の両面から伝えること

情報設計

サイト全体では「信頼感と親しみやすさ」を軸にし、ファーストビューでは職人の手仕事写真を使用して一目で世界観を伝える構成に。「私たちの強み」や「製品実績」などの情報は、ユーザーの関心が段階的に深まるよう設計し、最終的には問い合わせやOEM相談への導線へと自然につながるよう構成しています。図面の有無によって「お取引の流れ」を分けることで、初めてのユーザーにも分かりやすく安心感を持たせる工夫も加えました。

デザイン

深みのあるグリーンをアクセントに使用し、信頼性と視認性を両立。ベージュや生成りの背景色と組み合わせることで、自然素材を扱う企業らしい温かみも演出しました。写真はすべて高解像度かつ文脈に合ったものを選定し、製品や職人技の魅力が伝わるよう工夫。整列と余白を意識したレイアウトで、丁寧さと誠実さを感じるビジュアルに仕上げています。アイコンやフローチャートは、誰が見ても直感的に理解できるよう、シンプルにデザインしました。

制作範囲・期間

企画・ディレクションサポート、ワイヤーフレーム作成 : 2週間
デザイン : 3週間
コーディング : コーダーにバトンタッチ（WordPress構築中）

使用ツール

Illustrator / Photoshop / Figma