Firefox

Safari

Chrome

Internet Explorer

実績紹介

フォスター電機株式会社   「KOTORI」ECシステム HTML5スマホ対応改修

自分だけのオリジナルデザインが作れるフォステクスカンパニーさまのカスタムメイドヘッドフォン「KOTORI」。
元々はカスタマイズ画面がFlashで構築されていましたが、PCブラウザだけでなく、iPhone・iPad・Androidブラウザでも利用できるようにするため、HTML5+JavaScriptを使って全面改修を行いました。

特徴

特徴
・特殊な要件のECサイト構築
・HTML5+JavaScriptによる、インタラクティブなカスタマイズ画面
・サーバサイドにおけるパーツ画像の合成

  • TOP画面(PC)

  • カスタマイズ画面(PC)

  • カスタマイズ画面(スマホ)

タグ

  • HTML5 × Javascript × CSS3アプリケーション開発
  • PHPシステム開発
  • PHP
  • HTML5

課題と懸念点

・Flashで構築されていたため、スマホやタブレッドでオリジナルデザインを作るカスタマイズ画面を利用することができませんでした。
・スマホ、タブレッドに対応するため、フロント側をHTML5+JavaScriptを使って全面改修する必要がありました。

Top

プロジェクトについて

カスタムメイドのヘッドフォンの発注販売サイト

カスタムメイドのヘッドフォンの発注販売サイト
「KOTORI」は、老舗の音響機器メーカーFOSTEXから誕生したカスタムヘッドフォンブランドです。各パーツをそれぞれ自由に組み合わせて、他にはないオリジナルのヘッドフォンを作ることができます。

HTML5+JavaScriptによるPC、スマホ対応

リリース時には、ヘッドフォンのカスタマイズ画面はFlashで構築されていましたが、スマホやタブレットで利用したいとの要望が多くなり、その要望に対応すべく、今回、HTML5+JavaScriptで再構築を行いました。
KOTORI 101, KOTORI 201, KOTORI 301(近日リリース予定)の3種類のカスタム画面をPC、スマホ、タブレットから利用することができます。

Top

開発体制・構築手法など

作業範囲 詳細設計、開発、テスト
テクノロジー HTML5、CSS3、JavaScript
開発期間 5ヶ月
開発体制 プロジェクトマネージャー、フロントエンドエンジニア、バックエンドエンジニア
予算 非公開
デバイス PC、スマートフォン、タブレット
Top

プロジェクト主要メンバー紹介

中川善樹 プロジェクトマネージャー

Web業界の発展を期に、Web開発、特にPHPに目覚めアシアルに入社。
また、Ajax技術を活用したWebアプリ開発を得意とし、よりユーザビリティの高いサイト作りに気を配る。

橋本章史 フロントエンドエンジニア

以前は大手SIerでSEとして開発に携わっていたが、その中で「もっとプログラミングがしたい!」と思うようになり、アシアル株式会社に入社。
得意分野は、HTML、CSS、Javascript、FlexなどのフロントエンドとiPhoneアプ リ開発(Objective-C)。

Top

類似する実績

お問い合わせ

システム構築のご相談、研修やセミナー・執筆のご要望など、お気軽にお問い合わせくださいませ。
技術に明るい担当者が直接ご相談させて頂きます。

開発事例ダウンロード

下記のリンクより開発事例の資料をご覧いただけます。

PHP開発補助製品

  • SSLモバイル
  • JpGraph

Webサービス&携帯サービス

  • Monaca
  • PHPプロ!
  • OnsenUI