メインコンテンツへスキップ

何をお探しですか?

私たちのサービスを探索し、目標達成をどのようにお手伝いできるかをご覧ください

マルチページ対応オンラインデザインツール向けデザインプレビューバー

Netbase JSCは、CMSmart部門を通じて、タイのオンラインデザインツールプロバイダー向けにデザインプレビューバーを構築しました。ユーザーは複数のデザインを1ページ上に保持し、サムネイルで一覧確認、任意のデザインへジャンプ、印刷またはダウンロードするページの選択が可能です。クライアント名は非公開です。

類似プロジェクトを確認する 関連ソリューションを見る
star

実績サマリー

実績種別
ポートフォリオ実績:スコープと納品内容の記録(測定結果なし)
クライアント
印刷物・アパレル・ソーシャルメディアデザインを提供するオンラインデザインツールプロバイダー(非公開)
地域
タイ
サービス
ECサイト開発
提供体制
NetbaseのCMSmart部門
期間
コンセプトから機能完成まで約1週間
公開指標
なし

課題

クライアントは印刷物およびソーシャルメディア投稿向けのオンラインデザインを提供しており、大手ブラウザベースのデザインツールと競合しています。調査の結果、ユーザーが1つのデザインに対して複数のバージョン(例:2種類のポスター案)を作成するケースが多いことが判明しました。既存のツールでは各デザインが別ページに存在していたため、バージョンの比較には行き来が必要となり、時間がかかり操作ミスも起きやすい状態でした。クライアントは、複数のデザインを1ページ上に表示し、素早く切り替えられる仕組みを求めていました。

Netbase JSCが構築したもの

  • プレビュー。エディターの右側にバーを設置し、すべてのデザインページをサムネイルとして上から順に表示します。リストが長い場合はスクロールに対応します。
  • ショートカット。サムネイルをクリックすると、対象のデザインへ直接ジャンプできます。
  • ページ追加。新規ページボタンで、現在のページの直下に空白のデザインを追加できます。
  • 印刷ページの選択。作成したデザインの中から、印刷したいものだけをチェックして選択できます。
  • ダウンロード。同じバーからデザインをダウンロードできます。
  • バーの非表示。キャンバス全体を使いたい場合はバーを非表示にできます。バーが作業スペースを圧迫することに気づいたデザインチームがこの機能を提案しました。

作業の進め方

クライアントが開発チームにアイデアを説明し、チームはユーザーがバージョンを比較する方法に合わせてバーを右側に配置し、一連の操作を設計しました。コンセプト、デザイン、実装、改善まで約1週間で完了し、テストチームが各操作を確認してから納品しました。バーは既存のエディター上で動作するため、ユーザーはすでに使い慣れたテンプレート・テキスト・画像ツールをそのまま利用できます。

公開していない情報について

公開ストーリーはこの機能に対するクライアントの期待を記述したものであり、測定済みの結果ではないため、本実績では売上・トラフィック・コンバージョン率の数値は公開していません。プレビューバーはインターフェース開発であり、AI機能ではありません。

関連事例と次のステップ

招待状印刷業者がプロダクトデザイナーを受注フローに合わせてカスタマイズした事例や、印刷ショップが新しい商品ページとエディターツールを導入した事例もあります。全事例はWeb to Print導入事例集でご覧いただけます。

プロダクトパーソナライゼーションおよびWeb to Printプラットフォームソリューションはエディター機能を網羅しており、Web to Printプラットフォームガイドでは計画の立て方を、デザインエディターの自社開発vs購入ガイドではエディターの拡張と新規構築の比較を解説しています。ストアプラットフォームについてはコマース・エンタープライズ技術ページをご覧ください。さらに多くのNetbase JSCの実績を確認するか、Netbase JSCへお問い合わせいただき、類似プロジェクトをご確認ください。

情報源

  • デザインプレビューバーに関するCMSmartコミュニティストーリー(2023年2月)。Netbase JSCの事例リストに記録済み。クライアント名が記載されているため、URLは本ページに掲載していません。
  • David(CEO)提供のNetbase JSC事例リスト。David(CEO)により公開を証明済み、2026年9月17日(F142)。
  • MDN Web Docs、Canvas API、https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API(2026年9月17日アクセス):ブラウザベースのデザインエディターがページとサムネイルを描画する仕組み。
  • MDN Web Docs、HTMLCanvasElement toBlob()メソッド、https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toBlob(2026年9月17日アクセス):ブラウザエディターが描画済みデザインをダウンロード可能な画像ファイルに変換する仕組み。
Netbaseに問い合わせる

プロジェクトを相談する

Netbase JSCは、デジタルプロダクトおよびAI活用ビジネスシステムの設計・構築・モダナイゼーション・運用を支援します。
プロジェクトのお問い合わせ

project@netbasejsc.com

WhatsApp

+84 937 869 689

オフィス所在地

91 Nguyen Chi Thanh, Dong Da, Hanoi, Vietnam

ご連絡ください

構築・モダナイズ・運用したい内容をお聞かせください。

構築・モダナイズ・運用したい内容をお聞かせください。

Netbaseに問い合わせる