Tag Archives: レスポンシブデザイン

【Zen Cart制作事例】完全オリジナルのマスクブランド≪maSOUQ – マスーク≫グランドオープン

maSOUQ マスーク
URL:https://masouq.jp/

 

PCサイズ

 

Tabletサイズ

 

Mobileサイズ

 

昨今のコロナの影響で多くの方が甚大な影響を受けていると思いますが、
コロナの救世主となるようなサイト制作を行わせて頂きました!

 


業務用ではなく、デザインから全てオリジナルで製作したマスクの販売サイトでございます♪

 


サイト名前は【 maSOUQ マスーク 】です!

 


完全オリジナル製作のマスクブランドですので、
是非サイトでお買い物をお楽しみくださいませ(^O^)/

 

ショッピングサイトはコチラより

 

 

こちらのサイトはECサイト構築CMSの≪Zen Cart ver:1.5.5f≫を使ったサイトとして、新規構築したサイトとなっております。

 

スマホにも対応したレシポンシブWebデザインを考慮したオリジナルサイトデザインとして作らせていただきました。

 


[デザインコンセプト]
デザイン面については、 次のことを取り組みました。

 

1.商品であるマスクのデザインがはっきり見えるように白で統一。
2.モバイル画面のユーザビリティを考えてデザイン。
3.1カラムですっきりと目にデザインが入り込むようにデザイン。
4.商品のリストを横にスクロールさせることで視覚的に退屈しないサイトにデザイン。
5.お客様が押したくなるようにアイコンを盛り込んでデザイン。
6.あらゆる機能をたくさん導入しましたので、システムの整合性等の調節にかなり苦労致しました笑

 

 

[施策・技術]
技術面については 次のことを取り組みました。

 

【導入したメイン機能】
1.商品横スクロールの機能を加えました。
2.商品カテゴリーをデフォルトで全表示。
3.SNSやブログの内容をサイトに埋め込み。
4.QCSモジュールの作成とクレカ決済適応。
5.メインバナーのアニメーションスクロール。
6.レスポンシブ化し、PCからMobileまで対応。
7.ニュースのモジュールを導入とTOPページに表示カスタマイズ。
8.一定金額以上送料無料の機能を導入。
9.都道府県別の送料設定カスタマイズ。
10.ポイント管理機能。
11.顧客の注文の一括管理機能。
12.商品オプションの一括管理機能。
13.Image Handlerを導入による商品の追加画像(サブ画像)機能。
14.CKEditorのHTML入力補助ツールを導入。
15.CSVの出力機能カスタマイズ。
16.オプション毎の在庫管理機能。
17.サイトマップの登録。
18.グーグルアナリティクスの登録。
19.お商品のお気に入り登録機能。
20.商品ごとのお問合せ機能。
21.ワンページチェックアウト機能。
22.営業日カレンダー機能。

 

 

過去最多の機能を盛り込んだサイトとなりました!
大変でした泣 by 製作スタッフ一同

 

ショッピングサイトはコチラより

 

 

[サイト全体イメージ]

リリース日:2020/08/08

【Zen Cart制作事例】大五木材様 サイト GRAND OPEN!

木のモ 高品質な無垢フローリング材|kinomo 卸価格で高品質な無垢フローリング材を提供
URL:https://www.kinomo.ne.jp/


「大五木材」様のサイトリニューアルのお手伝いをさせて頂きました。
こちらのサイトはZen Cart本家、1.5.5dを使ったサイトとして、1.3系からリニューアルしたサイトとなっております。
昨今の時代を配慮して、スマホなどに対応しているレシポンシブWebデザインを考慮したオリジナルサイトデザインとして作らせていただきました。

Continue reading

ZenCart1.5.5系 モバイルファーストレスポンシブテンプレート公開&発売!

この度、オビタスターよりモバイルユーザビリティを重視した全デバイス対応のレスポンシブテンプレートを公開・発売することとなりました!

ZenCart1.5.5系・モバイルファーストテンプレート公開&発売!
URL:https://template.obitastar.co.jp/category/c-1_92_106.html

オビタスターPC版サイト

オビタスタータブレット版サイト

オビタスターモバイル版サイト

この度は、弊社より全デバイスに対応したZenCart1.5.5系レスポンシブテンプレートを発売させて頂く事となりました。
と言いますのも、
弊社は自社運営ECサイト「まつかわや」等の経験上、「レスポンシブ化された昨今のECサイトで操作面や誘導がうまく出来ているECショップがない」と常々思っておりました。

それはある意味仕方のない事かもしれません、ECサイトには新規登録・ログイン・カート・検索等といった必要な項目が非常に多く、スマホサイズにしてしまいますと、どうしても隠して表示するか、運営側が意図しない場所に表示するかしかなかったのです。
このような背景から日々試行錯誤し、出来上がったのが今回の「モバイルファーストテンプレート」です。

◆特徴

表示するモニターのサイズに合わせ、 3段階に変化をするレイアウトデザインです。 特にスマホサイズに特化したデザインテンプレートで、押しやすく、探しやすい構造になってます。

◆コメント

商売をしていくにあたり、サイトというのは必要不可欠なツールとなりますが、
どうしても費用が掛かってしまいます。
そこで我々は、お安くテンプレートをご提供することを念頭において、
更に他社テンプレートと差をつけるため、たくさんのテンプレートサイトを見漁りました。
今回私どもが製作しましたこちらのテンプレートはまず間違いなく他社のものより即戦力でご利用いただけるようにしておりますよ。
こちらのテンプレートは、モジュールのカスタマイズは一切しておりませんが、
近日、全て同梱されたパックを弊社がインストールまでさせて頂くプランも予定しておりますのでこうご期待ください。

[デザインコンセプト]

・モバイルファーストでレスポンシブサイトに仕上げました。
・どの商材にも対応できるように背景は白で清潔感のある仕上がりにしました。
(スタイルシートで自由に配色の変更を可能にしています。)
・PC・タブレット・スマホ等で見た時に、あまりサイトデザインに多いか差異が出ないよう、違和感を持たれないように意識し、シンプルですっきりとしたフラットデザインを取り入れました。
・アイコンはかわいく押しやすい物にしています。

[施策・技術]

・SEOを重視したデザインにしました。
・デバイスのサイズによってアイコンが代わるようにプログラムしました。
・商品の購入まで見やすくスムーズに操作できるようにデザインしました。
・カテゴリページ(商品一覧ページ)と全商品、新着商品ページのレイアウトを異なるデザインにしてハッキリ見分けがつくようにデザインしました。
・商品詳細ページに関して、商品と商品の説明のブロックを分けて、編集がしやすくサイトも見やすいように仕上げました。
・お問い合わせのページを複数作成し、項目も増やし、売りたい方、買いたい方の要望を聞くことができるようにしました。

[サイト全体イメージ]

リリース日:2018/12/07

【Geeklog制作事例】池内 嘉正様 サイトリニューアル

地球の島巡り・旅の鉄人 池内嘉正
URL:http://www.tetujin60.com

地球の島巡り・旅の鉄人 池内嘉正

地球の島巡り・旅の鉄人 池内嘉正

地球の島巡り・旅の鉄人 池内嘉正

「池内嘉正」様のサイトリニューアルのお手伝いをさせて頂きました。
こちらのサイトはGeeklog日本語開発版ver2.1.3を使ったサイトとして、旧バージョンよりリニューアルしたサイトとなっております。
リニューアルのため、スマホなどに対応しているレシポンシブWebデザインを考慮したオリジナルサイトデザインとして作らせていただきました。

Continue reading

【concrete5制作事例】串季 サイトリニューアルオープン

串季
URL:http://www.kushiki.com/

「串季」様のサイトリニューアルのお手伝いをさせて頂きました。
こちらのサイトはconcrete5を使ったサイトとして、htmlでの制作からリニューアルしたサイトとなっております。
リニューアルの際、アクセシビリティにできるだけ考慮したオリジナルサイトデザインとして作らせていただきました。

[デザインコンセプト]

・モバイルファーストと言われる時代背景から、スマホ・タブレットで見やすいようコンテンツのサイズを768pxで作成しております。
こうする事で、PCで見た場合とタブレットで見た場合にほぼ違いが発生しません。
・また、スマホサイズからの作成で、タブレット→PCサイトを作成していっておりますので、スマホで閲覧時に一番よく見えるように作成されております。
これは、飲食店を検索するときのイメージをお考え下さい、飲食店を探す場合PCで検索するでしょうか?
もちろんPCで検索する場合もあるかと思われますが、大半はスマホで検索されると考えられます。
それは、外出中のシーンや自宅にいるシーンでも容易に想像できます。
・カラー等は、串焼のイメージを損なわないような暖色系をポイントに使用し、安っぽくならない様に心がけデザインしました。
・また、画像やメニュー等はお店のスタッフ様でも簡単に変更できるようにと考え作成しております。
あまり複雑に作りますと、お店のスタッフ様の方で変更するのが億劫にならない為です。

[施策・技術]

・全ページSSL化対応。
・PC、タブレット、スマホのレスポンシブ対応
・CMSのconcrete5の全ページSSL化対応
・httpでのアクセスの場合、httpsへのリダイレクト対応
・ローテンションバナーを導入し、TOPページで導入したブロックのいくつかを回るようにしております。

リリース日:2018/05/29

【Zen Cart制作事例】エルクロス様 サイトリニューアル

エルクロス スワロフスキー激安通販・卸売 LX
URL:https://www.l-cross.jp/

エルクロス スワロフスキー激安通販・卸売 LX

エルクロス スワロフスキー激安通販・卸売 LX

「エルクロス」様のサイトリニューアルのお手伝いをさせて頂きました。
こちらのサイトはZen Cart本家最新版、1.5.5dを使ったサイトとして、1.3系からリニューアルしたサイトとなっております。
リニューアルのため、スマホなどに対応しているレシポンシブWebデザインを考慮したオリジナルサイトデザインとして作らせていただきました。

Continue reading

【concrete5制作事例】 御福まつかわや 華の振袖展特設サイト 追加ページと広告媒体作成

華の振袖展 | 御福まつかわやの華の振袖展特設サイト
URL:https://event.matukawaya.com/furisode/

以前ご紹介いたしました「御福まつかわや 華の振袖展特設サイト」の追加ページの作成と「御福まつかわや 華の振袖展」の広告媒体デザイン作成をさせて頂きました。

過去に作成した際の記事は下記となります。
【concrete5制作事例】 御福まつかわや 華の振袖展特設サイト 新規オープン

Continue reading

【Zen Cart制作事例】コスモマシン様 サイトリニューアル

コスモマシン 中古機械 買取・販売・整備 : 中古機械の販売・買取・修理のスペシャリスト
URL:https://www.cosmomachine.com/

コスモマシン 中古機械 買取・販売・整備 : 中古機械の販売・買取・修理のスペシャリスト

「コスモマシン」様のサイトリニューアルのお手伝いをさせて頂きました。
こちらのサイトはZen Cart本家最新版、1.5.5dを使ったサイトとして、1.3系からリニューアルしたサイトとなっております。
リニューアルのため、スマホなどに対応しているレシポンシブWebデザインを考慮したオリジナルサイトデザインとして作らせていただきました。

過去に作成した際の記事は下記となります。
【Zen Cart制作事例】コスモマシン株式会社様

Continue reading

【Zen Cart制作事例】富士文具株式会社様 カスタマイズ・リニューアルオープン

文具・文房具・事務用品卸サイト「ブングオーダー」 : ブングオーダー
URL:http://www.bungu-order.jp/

過去にこちらでご紹介させていただきましたブングオーダー(富士文具株式会社)様
https://wordpress.obitastar.co.jp/2014/12/24/p2119/
のサイトにて、新しい機能を導入・カスタマイズを行い、この度リニューアルオープンのお手伝いをさせていただきましたので、ご紹介させていただきます。

Continue reading

【concrete5制作事例】 御福まつかわや 薫風の浴衣展 特設サイト 新規オープン

浴衣展 | 御福まつかわやの浴衣展
URL:https://event.matukawaya.com/yukata/

弊社の運営している呉服の専門店「まつかわや」のイベントサイト 薫風の浴衣展のサイトとして、concrete5で新規オープンさせていただきました。

Continue reading