Client: Microsoft
Role: Associate Creative Director
The Ask
Microsoft created a dedicated building to showcase its products in various retail settings, ensuring optimal displays tailored to each product's unique features. Following this successful approach, Microsoft aimed to replicate the strategy online. The goal was to implement best practices in a “Contoso” ecommerce website across its digital properties, presenting products on the website in a manner that maximizes their selling potential in both a desktop and mobile experience.
Strategy
Following an in-depth research phase, website pages were structured within the ecommerce sales funnel. Emphasis was on integrating functionalities to enhance the sales experience, ensuring a intuitive process leaving customers informed throughout subsequent steps. This collaborative effort involved working closely with Microsoft staff to gather insights and outline critical points for each product type.
Execution
1. Pages
Website pages were designed with a clean white background to showcase products clearly and mimic a well-lit product display. Inversely, when users interacted with the website and entered information, users would have a black background signaling that they were in a different phase of usage. Advertisements were featured on a distinct grey background which signaled additional information.
2. UI Iconography and color palette
A UI kit was created featuring a clean and easily intuitive design style. The color palette was selected to emphasize actionable sections of the page, directing users' attention to key areas. This ensured a user-friendly interface that guided users through content and interacting when necessary.
3. Functionality
Categorization, search, product comparison, and refinement functionalities were implemented to streamline the user experience. Additionally, supplementary information was provided for each product, including similar items, products compatible with the current selection, and potential discounts when combined with other products. This valuable information is placed below the products and also within the shopping cart, ensuring users can always make the most of valuable opportunities and increasing sales.
依頼内容
Microsoftは、小売環境に最適化した製品ディスプレイを実現する専用施設を構築し、各製品の特性を最大限に活かした展示を成功させた。
この成功をもとに、同様の戦略をオンラインでも再現することを目指し、「Contoso」ECサイトを活用して、デスクトップとモバイル両方で最適な販売体験を実現することが目標となった。
戦略
綿密なリサーチフェーズを経て、ECサイトの各ページを販売ファネルに沿った構造で設計。
販売体験を向上させる機能を統合し、ユーザーが次のアクションを明確に把握できる流れを構築。
Microsoftのスタッフと密に連携し、各製品の特性を活かすための重要なポイントを整理・設計。
実施内容
1. ページデザイン
清潔感のあるホワイト背景を基調とし、製品が際立つデザインを採用。
黒背景を使用し、ユーザーが情報入力フェーズに入ったことを直感的に認識できるよう設計。
広告はグレー背景で統一し、追加情報としての役割を明確化。
2. UIアイコンとカラーパレット
直感的なデザインのUIキットを開発し、ユーザーがスムーズに操作できる環境を整備。
カラーパレットを工夫し、アクションエリアを強調することで、ユーザーの注意を適切に誘導。
視認性の高いナビゲーションを実装し、ユーザーが必要な情報をすぐに見つけられる設計。
3. 機能性の向上
カテゴリー分類、検索、商品比較、フィルタリング機能を強化し、ユーザーが求める製品を迅速に見つけられるように。
関連商品や互換性のある製品、セット割引情報を提供し、購入の意思決定をサポート。
これらの情報を商品ページとショッピングカート内に配置することで、購入機会を最大化し、売上向上を実現。