月と蝶のグラフィックを交えてサービスとソリューションを解説する英語版のページ。
女性のポートレートと製品紹介を大胆に配した日本語版公式サイトのトップ画面。
自社開発のハードウェア製品群を整然としたリスト形式で構造化した製品案内ページ。
学会発表や本社移転情報などのアナウンスを時系列に整理した最新情報ページ。
募集職種や勤務地、問い合わせ先への導線をシンプルにまとめた採用情報ページ。
近未来的な大地のビジュアルでコアビジネスを提示する英語版サイトのトップ画面。
月と蝶のグラフィックを交えてサービスとソリューションを解説する英語版のページ。

ハード・ソフト融合技術を世界へ発信するコーポレートサイトのグローバルWebデザイン・情報アーキテクチャ構築

プロジェクトの概要とデザインにおける挑戦

株式会社インフィニテックの企業公式サイト(2006年版)における、日本語版および英語版のWebデザイン、UI/UX設計、情報アーキテクチャ(IA)の最適化、ならびにトータルブランディングを包含したマルチリンガルWebサイト構築プロジェクトを担当しました。 クライアントは、教育現場を支える授業支援システムから高度な情報セキュリティソフトから画像処理技術に至るまで、最先端のデジタルソリューションを自社で一貫開発する独立系IT企業です。 本プロジェクトにおける最大の挑戦は、ハードウェアとソフトウェアの双方にまたがる多岐にわたる製品群(マルチシグナル伝送装置、電源制御ユニット、遠隔講義システムなど)の専門的かつ複雑な技術情報を構造化し、国内外のビジネスパートナー(内田洋行、日本ユニシス等)やエンタープライズ顧客に対して、企業の先進性と圧倒的な技術的信頼性を直感的に伝えるグローバルスタンダードなWebアイデンティティの確立にありました。

デザインの「なぜ」を導くユーザー体験(UX)とマルチリンガル情報設計

日本語版と英語版の双方において、ターゲットユーザーの探索行動と心理的ニーズに基づいた明確なUX戦略を導入しました。 日本語版のメインビジュアルでは、ビジネスパーソンが抱えるリアルなセキュリティ課題(例:「ノートPCの持ち出しによる情報漏えい対策」)をテキストと人物のポートレートによって具体的に顕在化させ、それに対する最適解としてUSBキー連動型情報保護ツール「A-LOCKY SF」等のソリューションへ最短距離で誘導するストーリー性のあるファーストビューを設計。 一方で、国際的なビジネス展開と技術調達を主目的とするグローバルユーザー(英語版)向けには、「Welcome to the website of Infinitec」のメッセージとともに、回路パターンを想起させる大地を進む人々の近未来的なビジュアルを採用しました。 さらに、虫眼鏡で透過された美しい蝶のグラフィックをあえて静謐なホワイトスペース(余白)の中に配することで、インフィニテックが持つ精密な画像処理技術、センササポートが、デジタル社会に「可視化と安心」をもたらすという企業哲学(ステートメント)を抽象概念として翻訳し、海外市場におけるブランド認知を最適化しています。

アクセシビリティを担保する3カラムレイアウトと共通トーン&マナーの徹底

サイト全体のインターフェース設計においては、ユーザーの認知負荷を最小限に抑えるため、左側に機能的な垂直ナビゲーション(製品案内・最新情報・会社情報などのカテゴリーメニュー)を配した、堅牢で破綻のない3カラムのグリッドレイアウトを採用しました。 色彩計画には、企業の健全性と最新テクノロジーの融合を象徴する鮮やかなブライトグリーンと、クリーンな信頼感を醸成するソリッドなグレーをベースカラーとして定義。 製品案内一覧ページでは、ハードウェア製品(IFT-MS1/MS2、IFT-P1500等)やハイビジョン遠隔講義システム(HD-DLS)の製品写真を統一されたフォーマットで整然と構造化し、IT管理者が必要なスペックシートや詳細情報(詳細 >>)へ瞬時にアクセスできる優れた検索性と情報階層(インデックス化)を実現しました。 右サイドバーには、営業活動をダイレクトに支援するサービス窓口(フリーダイヤル・Tel・Fax)や問い合わせメールへの導線を常時固定配置し、ISO14001・ISO9001認証取得といった品質保証ファクトを明記することで、エンタープライズ領域におけるBtoBサイトとしての誠実さと確固たる信頼性を担保しています。

Webデザインおよびグローバルサイト構築における4つのコア・アプローチ

  • 市場特性に応じたマルチリンガルビジュアル戦略:国内向けには課題解決型の具体的なソリューション提示、海外向けには企業のコアコンピタンス(RAVION、セキュリティ、音声・画像認識)と志を伝える抽象表現の使い分け。
  • 複雑なプロダクトポートフォリオの構造化:マルチシグナル伝送、電源制御、遠隔講義システム、各種セキュリティソフトなど、多岐にわたる自社開発LSI・製品群を迷わせずに俯瞰できる製品案内一覧のIA設計。
  • コンバージョンを最大化するBtoB導線設計:最新情報(学会発表や本社移転アナウンス等)、採用情報(募集職種・勤務地)、問い合わせ先(Tel・メール)への動線を各画面の右・下部に定常配置し、ビジネス機会を損失しないレイアウト。
  • 一貫したコーポレート・アイデンティティの体現:ポスターやカタログ(AdvantageClass)、UI画面デザインと完全に連動した色彩・タイポグラフィのトーン&マナーをWeb上でシームレスに再現。

デザインの成果と今後の展望

グローバルサイトとして全面刷新されたインフィニテックの公式サイト(2006年版)は、日本教育工学会(JSET)等の主要な場における製品展示や、国内外の新規取引先開拓、リクルーティング(優秀なハード・ソフトエンジニアの獲得)において、企業の技術基盤と先進的なブランド力を正確に伝えるデジタル中枢として多大な成果を収めました。 現在、開発元である株式会社インフィニテックの優れた技術アセットや受託開発体制は、株式会社プリバテックへと発展的に統合・継承され、通信、センサ、画像処理といったより高度な組み込み・Webソリューションとして社会へ実装されています。 本プロジェクトで追求した「複雑な先端テクノロジーを、ユーザーの文脈に合わせて明快かつ美しく視覚化し、グローバルに翻訳する」というWebデザインの設計思想は、多様な情報が錯綜する現代のデジタルブランディングにおいても、時代を超えて機能し続ける確固たる価値の証明となっています。

Global Web Design and Information Architecture for a Corporate Site Transmitting Hardware-Software Fusion Technologies to the World

Project Overview and Design Challenges

I was in charge of the multilingual website construction project for Infinitec Co., Ltd.’s official corporate website (2006 version), encompassing Japanese and English web design, UI/UX engineering, Information Architecture (IA) optimization, and total branding. The client is an independent IT enterprise that consistently and internally develops cutting-edge digital solutions, ranging from classroom support systems that underpin educational settings to advanced information security software and image processing technologies. The ultimate challenge of this project lay in establishing a global-standard web identity that structures specialized and complex technical information for a diverse product portfolio spanning both hardware and software (such as multi-signal transmission devices, power control units, and remote lecture systems) to intuitively convey the company’s advanced nature and overwhelming technological reliability to domestic and international business partners (such as Uchida Yoko, Nihon Unisys, etc.) and enterprise customers.

User Experience (UX) and Multilingual Information Architecture Guiding the “Why” of Design

In both the Japanese and English versions, we introduced a clear UX strategy rooted in the exploratory behaviors and psychological needs of target users. In the main visual of the Japanese version, we concretely brought to light real security challenges faced by business professionals (e.g., “Countermeasures against information leakage caused by carrying notebooks outside the office”) using text and portraits of people. We designed a story-driven first view that guides users via the shortest distance to solutions like the USB key-linked information protection tool “A-LOCKY SF” as the optimal answer. Conversely, for global users (English version) whose primary objectives are international business deployment and technology procurement, we adopted a futuristic visual of people advancing across a terrain reminiscent of circuit patterns, alongside the message “Welcome to the website of Infinitec.” Furthermore, by deliberately positioning a beautiful graphic of a butterfly translucent under a magnifying glass within a tranquil whitespace, we translated the corporate philosophy (statement)—that Infinitec’s precise image processing technology and sensor support bring “visualization and peace of mind” to a digital society—into an abstract concept, optimizing brand recognition in overseas markets.

Enforcing a 3-Column Layout and Common Tone & Manners Ensuring Accessibility

In engineering the interface for the entire site, to minimize the user’s cognitive load, we adopted a robust and flawless 3-column grid layout that features a functional vertical navigation on the left side (category menus for product guides, what’s new, corporate profile, etc.). For the color planning, we defined a vibrant bright green symbolizing the fusion of corporate healthiness with state-of-the-art technology, and a solid gray that fosters clean reliability as base colors. On the product guide directory page, product photographs of hardware items (IFT-MS1/MS2, IFT-P1500, etc.) and high-definition remote lecture systems (HD-DLS) are tidily structured within a unified format, realizing excellent searchability and information hierarchies (indexing) that allow IT administrators to instantly access necessary spec sheets and detailed information (Details >>). The right sidebar constantly features fixed flows to service desks (Toll-Free, Tel, Fax) and inquiry emails that directly support sales activities, while explicitly stating quality assurance facts like ISO14001 and ISO9001 certifications to guarantee sincerity and firm reliability as a BtoB site in the enterprise domain.

Four Core Approaches in Web Design and Global Site Construction

  • Multilingual Visual Strategies Tailored to Market Characteristics: Selectively using problem-solving concrete solution presentations for the domestic market, and abstract expressions that communicate the company’s core competencies (RAVION, security, audio/image recognition) and aspirations for overseas audiences.
  • Structuring Complex Product Portfolios: Engineering an IA for the product guide directory that allows users to overview a diverse array of internally developed LSIs and product groups—including multi-signal transmission, power control, remote lecture systems, and various security software—without getting lost.
  • BtoB Flow Designs Maximizing Conversions: Constantly positioning flows to the latest news (academic conference presentations, head office relocation announcements, etc.), recruitment information (job openings, work locations), and contact details (Tel, email) on the right and bottom sections of each screen to ensure a layout that does not miss business opportunities.
  • Embodying a Consistent Corporate Identity: Seamlessly reproducing color, typography tones, and manners on the web that perfectly link with posters, catalogs (AdvantageClass), and UI screen designs.

Design Achievements and Future Outlook

Completely renewed as a global site, Infinitec’s official website (2006 version) achieved immense success as a digital nucleus that accurately communicates the company’s technological foundations and advanced brand power during product exhibitions at major venues like the Japan Society for Educational Technology (JSET), the development of new domestic and international business accounts, and recruiting efforts (acquiring talented hardware and software engineers). Currently, the excellent technological assets and contract development frameworks of the developer, Infinitec Co., Ltd., have been progressively integrated and succeeded by Primatec Co., Ltd., implemented into society as higher-level embedded and web solutions spanning communications, sensors, and image processing. The web design philosophy pursued in this project—”clearly, beautifully visualizing complex advanced technologies according to the user’s context and translating them globally”—stands as a testament to firm values that continue to function across eras, even in today’s digital branding environments where diverse information is convoluted.
■ 本WEBサイトに掲載されている、会社名、商品名、サービス名、ブランド名、ロゴマーク、サービスマーク、スローガン、キャッチコピー等の著作権・商標権は、各権利所有者に帰属します。■ 本コンテンツは、著者の制作実績およびスキルの紹介を目的として掲載しており、権利を侵害する意図はございません。■ 制作実績のうち、直接取引以外の案件につきましては、広告代理店、コンサルティング会社、制作会社等のパートナー企業様との提携、あるいは仲介による制作実績となります。■ 本ポートフォリオへの掲載に問題がある場合は、お手数ですがお問い合わせフォームよりご連絡ください。迅速に対応をさせていただきます。