お知らせ
当サイトは、現在リニューアルを進めております。そのため実績や料金はサンプルとなっております。
リニューアル完了後お知らせいたします。ご連絡はエックスのDMからお願いいたします。
SNS(エックスを除く)、下層ページには遷移しません。
-
Service
// 提供するサービス一覧//
※このセクションでは、当方が提供するサービスを紹介する予定です。その紹介にアレンジしたシリンダースライダーを採用しました。このスライダーにはそれぞれのサービスにあった画像や動画を配置する予定です。 右にある矢印ボタンで、シリンダー状に並んだスライダーが回転します。今回は2枚目以降よりアレンジした部分について紹介させていただきます。
-
Feature-1
// シリンダースライダーについて1 //
元はシリンダー状に並んだ画像と、テキスト画像の2種類を回転させていましたが、
"シリンダースライダー”
"テキストスライダー"
"カバースライダー"
の3種類が連動するようにアレンジしました。 -
Feature-2
// シリンダスライダーについて2//
スライダー1枚につき画像1枚が原則ですが、複数の画像を組み合わせて1枚にすることで、様々な一面をシリンダースライダーで表現できると考えました。。
-
Feature-3
// テキストスライダーについて //
テキストは編集がしやすいように画像ではなく、HTMLで作成しています。これにより、以下のような形でリンクボタンを配置し、お問い合わせ、別のページやコンテンツへの導線を用意することができます。
-
Feature-4
// カバースライダーについて//
テキストの背景には視認性を上げる目的と、切替時にエフェクトを発生させることで目を引いていただけるようにしたいと思い、実装しました。使用したエフェクトは「スライダーウェーブ」です。ノイズの値を調整し、切り替わった際の波の表現を大きくしてあります。
Price.
※このセクションでは各プランと料金の紹介をする予定です。
プラン1 ¥112,358~
- TOP1枚のデザイン
- TOP1枚のコーディング
- アニメーション3種(WebGLを除く)
- お問い合わせフォーム
- フルイドレスポンシブ対応
- SEO設定・セキュリティ対策
- アフターサポート1ヶ月
プラン2 ¥112,358~
- TOP1枚のデザイン
- TOP1枚のコーディング
- アニメーション3種(WebGLを除く)
- お問い合わせフォーム
- フルイドレスポンシブ対応
- SEO設定・セキュリティ対策
- アフターサポート1ヶ月
プラン3 ¥112,358~
- TOP1枚のデザイン
- TOP1枚のコーディング
- アニメーション3種(WebGLを除く)
- お問い合わせフォーム
- フルイドレスポンシブ対応
- SEO設定・セキュリティ対策
- アフターサポート1ヶ月
プラン4 ¥112,358~
- TOP1枚のデザイン
- TOP1枚のコーディング
- アニメーション3種(WebGLを除く)
- お問い合わせフォーム
- フルイドレスポンシブ対応
- SEO設定・セキュリティ対策
- アフターサポート1ヶ月
プラン5 ¥112,358~
- TOP1枚のデザイン
- TOP1枚のコーディング
- アニメーション3種(WebGLを除く)
- お問い合わせフォーム
- フルイドレスポンシブ対応
- SEO設定・セキュリティ対策
- アフターサポート1ヶ月
// リフレクトスライダーについて//
ボタンを押すことで画像とテキストが連動して切り替わります。
スライダーの画像は、中央に表示される画像のみ色がつく特性を活かし、黄金長方形が次第に形成されていく様子を表現しました。
1280px以上のモニターでは、テキストスライダーは3枚表示にすることで、他のプランを見てもらえるように調整しました。HTMLで編集可能です。
リフレクトスライダーの角度は、プランの可読性を上げるため、左奥方向に向かって伸びるよう角度を調整しました。
それに合わせて左右のスライドで透明度を変えており、左側をより薄く表示させています。
Works
このセクションでは過去の制作実績を紹介する予定です。
エフェクト"Plane-sphere"に、様々なジオメトリを合わせました。
下に表示されている6つの物体は、スクロールしていくと1段目の状態から2段目のように実績紹介に変化します。
※スマホ版では上から4つ目以降が変化します。
画像はホバーすることで色が戻ります。
※スマホ版の画像は変化したときから色がついています。
FLOW.
-
01
お問い合わせ(無料)
各種お問い合わせフォームよりお気軽にご連絡下さい
-
02
ヒアリング・お見積り(無料)
ご希望をお伺いし、お客様に合ったプランをご提案。 プランに同意いただけましたら、見積書を作成いたします。
-
03
ご契約
見積書の内容にご納得していただけましたら、契約となります。 この時、制作手付金として合計金額の50%を頂戴いたします。
-
04
デザイン
お打ち合わせ後、ご希望のデザインを作成いたします。
-
05
コーディング
デザインが確定しましたら、実際にWebサイトを作成していきます。
-
06
テストサイト確認
はじめに、テストサイトにて内容や挙動を確認していただきます。 不備があった場合は修正をし、再度のご確認となります。
-
07
本番サイト移行
テストサイトのご確認後、本番サイトへ移行し、最終調整をさせていただきます。
-
08
納品・ご請求
本番サイトに不備がない場合、本公開(ファイル提出)をもって納品とさせていただきます。 納品完了後、所定の日程までに残りの制作費(50%)をお振込みいただきます。
-
09
納品報告書の提出
サイト制作にあたり使用したチェックシート、注意事項、操作方法をまとめたマニュアルを載せた「納品報告書」を後日送付させていただきます。
FAQ.
//スライダーzの応用//
スライダーzの、後ろから手前に向かってくる性質を用いて、答えのカードが切り替わる実装に挑戦しました。
質問を押すと、その番号に対応したカードが現れます。
カードが切り替わる際は目に留まりやすくなるよう、回転しながら手前に迫るアニメーションにしました。
また、カード自体にリンク機能も付与できるため、案内したいページへ誘導可能です。
課題は残っていますが、改善してより使いやすくしたいです。
- Q1.営業時間や稼働日を教えて下さい
- Q2.電話による相談は可能ですか?
- Q3.制作日数はどれぐらいかかりますか?
- Q4.制作予算があまりないので、希望のサイトが作れるか心配です
- Q5.デザインだけ、またはコーディングだけ依頼することはできますか?
-
Q6.WebGLの実装はどのようなことが可能ですか?
既存のサイトに取り入れることも可能ですか? - Q7.支払い方法は何が使えますか?
- Q8.キャンセルすることは可能ですか?