シェアしたくなる最新のWebサービス・ITニュース情報をチェック!
  • follow us in feedly

アプギガトップ > Webサービス > スマホのブラウザから、指先1本でWebサイトを制作できる「adsy.me」がスゴイ!
注目記事ピックアップ
今すぐ、自分の知識を「オンライン学習コース」としてWebに公開できる「Thinkific」の多機能ぶりに驚愕!
share0
今すぐ、自分の知識を「オンライン学習コース」としてWebに公開できる「Thinkific」の多機能ぶりに驚愕!
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
share0
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
有名WebサービスのAPIをすべて同じ書き方でプログラミング可能な「RapidAPI」は、検索・テストもブラウザ上で実行可能!
share0
有名WebサービスのAPIをすべて同じ書き方でプログラミング可能な「RapidAPI」は、検索・テストもブラウザ上で実行可能!
編集ソフト不要!アップロードした画像のURLをいじるだけで多彩な加工編集を実現する「Scaley.io」が登録不要で無料公開中!
share0
編集ソフト不要!アップロードした画像のURLをいじるだけで多彩な加工編集を実現する「Scaley.io」が登録不要で無料公開中!
JavaScriptでマインクラフト風の建造物が作れる無料Webアプリ「Web Blocks」で遊んでみた!
share0
JavaScriptでマインクラフト風の建造物が作れる無料Webアプリ「Web Blocks」で遊んでみた!
こんなAR技術が欲しかった!スマホをかざすだけでプロ並みのスケッチを描ける「SketchAR」アプリを使ってみた!
share0
こんなAR技術が欲しかった!スマホをかざすだけでプロ並みのスケッチを描ける「SketchAR」アプリを使ってみた!
スクショ付きでブックマークを一元管理できるWebアプリ「Bookmark OS」を使ってみた!
share0
スクショ付きでブックマークを一元管理できるWebアプリ「Bookmark OS」を使ってみた!
わずか1行のコードで、Web制作が劇的に捗るサービスと連携し放題になる「StackPile」を使ってみた!
share0
わずか1行のコードで、Web制作が劇的に捗るサービスと連携し放題になる「StackPile」を使ってみた!
まだ進化を続けるGoogle検索の特殊機能12選をまとめてみた!
share0
まだ進化を続けるGoogle検索の特殊機能12選をまとめてみた!
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
share0
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
開発が面倒なWebコンテンツを「ウィジェット化」して誰でも利用可能にする無料サービス「Widgetic」を使ってみた!
share0
開発が面倒なWebコンテンツを「ウィジェット化」して誰でも利用可能にする無料サービス「Widgetic」を使ってみた!
Web上でプログラミングに特化したスクリーンキャストを無料で作れる「Scrimba」の革命的な機能がスゴイと話題に!
share0
Web上でプログラミングに特化したスクリーンキャストを無料で作れる「Scrimba」の革命的な機能がスゴイと話題に!
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
share0
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
JavaScriptの学習にオススメなWebコードエディタ「Carbide」の万能すぎる可視化ウィジェットがヤバイ!
share0
JavaScriptの学習にオススメなWebコードエディタ「Carbide」の万能すぎる可視化ウィジェットがヤバイ!
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
share0
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
ブラウザから即起動!ゼロからSVG画像を作成できるWebエディタ「Vectr」が完全無料で公開中!
share0
ブラウザから即起動!ゼロからSVG画像を作成できるWebエディタ「Vectr」が完全無料で公開中!
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
share0
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
天才的な猛者が開発した究極の「HTML5ゲーム」16選が思わず熱くなり過ぎる件!
share0
天才的な猛者が開発した究極の「HTML5ゲーム」16選が思わず熱くなり過ぎる件!
Webサイトに訪れたユーザーの行動を「映像化」してトラッキングできる「Jaco」を使ってみた!
share0
Webサイトに訪れたユーザーの行動を「映像化」してトラッキングできる「Jaco」を使ってみた!
データ可視化の最強ツール!Web上でスライド資料やインフォグラフィックを制作できる万能Webエディタ「Visme」を使ってみた!
share0
データ可視化の最強ツール!Web上でスライド資料やインフォグラフィックを制作できる万能Webエディタ「Visme」を使ってみた!
Webサービス
ad 今の年収で満足ですか?
typeで転職した71%が年収アップ!
2015/02/27 20:50

スマホのブラウザから、指先1本でWebサイトを制作できる「adsy.me」がスゴイ!

adsy_01 どうも、まさとらん(@0310lan)です!

スマホに「最適化」されたWebサイトを作りたい方に朗報です!

パソコン不要で、スマホのブラウザから指で画面をタッチしていくだけで、インタラクティブなWebサイトを制作できるサービスをご紹介します。

それが、「adsy.me」です!
adsy_02 ※一応、PCブラウザからでも動作するようになっています…。


「adsy.me」とは?
たいていのWebサービス・アプリは、PCブラウザで動作するのが基本ですが、「adsy.me」はスマホのブラウザに最適化されているのが特徴となっています。

これにより、アプリをインストールすること無く、スマホからブラウザを開くだけで、すぐに多彩なWebサイトの制作を開始できるのです!
adsy_03 写真・動画・音楽・マップ…など、自作のボタンでインタラクティブに表示することも可能になっています。


早速作ってみよう!
まずは、スマホのブラウザから公式サイト(http://www.adsy.me/)へアクセスして、ユーザー登録をします。
adsy_04

登録が完了したら、Webサイトの背景色を設定できるので、カラーを決めたりスマホに保存されている写真や、Webから画像を検索して設定しましょう!
adsy_05 今回は、Web上から適当な画像を設定してみました…。


次に、Webサイトへ「タイトル」を設置してみましょう!

そこで、「+」アイコンから「テキスト編集ボタン」をタップします。
adsy_06

文字を入力したら、フォントやカラー、透明度などをカスタマイズします。
adsy_07

事前に用意されている、多彩なアイコンも利用できるので活用しましょう!
adsy_08

さらに、動画コンテンツもサイト内に埋め込んでみたいと思います。
adsy_09

背景画像と同様に、Web上から適当な動画を検索して設置可能です。
adsy_10 ちなみに、指でドラッグしたり、ピンチイン・アウトなどで、サイズや回転などの編集も直感的にできます。


ある程度できたら、画面上部のアイコンをタップして「プレビュー」表示してみましょう!
adsy_11 このように、すべての操作が「指1本」で直感的にコントロールできるので、誰でも楽しみながらスマホサイトを作れるのが大きな魅力となっています。


ページを追加してみる!
せっかくなので、ページをいくつか追加してみましょう!

「ページ追加」ボタンをタップして、先ほどと同じく背景色・画像を設定していきます。
adsy_12

自分の好きな音楽を「SoundCloud」などから検索して埋め込んだりできます。
adsy_13 再生ボタンをタップすると、レコードのようにアイコンがクルクル回転するアニメーションも楽しめるようになっています。


また、Googleマップを利用して、任意のキーワードから地図を検索することもできます。
adsy_14

通常のマップや、航空写真を簡単にサイトへ埋め込めるようになっています。
adsy_15

さらに、面白い特徴として、「リンク」を作成する場合には、任意の箇所を「塗り絵」のようになぞって作成するようになっています。
adsy_16

そして、外部サイトや、メール、電話…など、多彩なサービスと連携したり、作成済みのページへリンクを貼ることができるわけです。
adsy_17

今回は、1ページ目に戻るボタンを作ったので、タップすればホームへ戻れるようになります。
adsy_18 もちろん、自分で作成した画像をボタンのように見せることも可能で、活用次第では本格的なサイト構築まで可能でしょう!

最終的に、完成したら「書き出し」をすることで、世界中に一般公開もできます。 ちなみに、ページ数に制限は無く、複数サイトの制作にも対応しています。


参考までに、「adsy.me」の使い方を紹介した動画を掲載しておきますので、ご興味ある方はぜひ視聴してみてください!




おまけ
最後に、PC・スマホに対応した本格的なWebサイトを、ブラウザ上で制作できるサービスも合わせてご紹介しておきます!

【1日でプロに匹敵するwebサイトをデザインから公開まで完結できる「Webflow」正式版に驚愕!】
adsy_19 ほぼすべての作業をドラッグ&ドロップで構築できるように設計されており、マルチデバイス対応のサイトを簡単に作れるのが魅力的です。

さらに、そのまま簡易ホスティングもしてくれるので、ネット上へ公開することもでき、完成したサイトの「コード書き出し」にも対応しています!


まとめ
「adsy.me」を使ってみると、スマホだけでこんなに面白いWebサイトが作れることに驚くかもしれません。

また、SNSのような機能も搭載されているので、ユーザー同士のコミュニケーションが取れたり、有料で独自ドメインにも対応してくれるとのこと。

作ったサイトは、「埋め込みコード」でブログなどにも貼り付けられるので、ご興味ある方はぜひ挑戦してみてください!

<参考>
「adsy.me」公式サイト


written by まさとらん




まさとらん

国内外問わず「良いモノ」だけひたすら集めて情報共有してます。
厳選ネタはアプギガ内で分かりやすく情報発信中!
その他の旬なネタは、twitterにて発信してますので、お気軽にどうぞ!

twitter:0310lan

この記事を読んでいる人は、他にこんな記事も読んでいます。
Related Posts Plugin for WordPress, Blogger...

ページトップへ戻る