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

アプギガトップ > Webサービス > スマホのブラウザから、指先1本でWebサイトを制作できる「adsy.me」がスゴイ!
注目記事ピックアップ
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
share0
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
コピペ一発!どんなWebサイトもチャットサポートを無料で導入可能な「Crisp」を使ってみた!
share0
コピペ一発!どんなWebサイトもチャットサポートを無料で導入可能な「Crisp」を使ってみた!
JavaScriptでマインクラフト風の建造物が作れる無料Webアプリ「Web Blocks」で遊んでみた!
share0
JavaScriptでマインクラフト風の建造物が作れる無料Webアプリ「Web Blocks」で遊んでみた!
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
share0
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
こんなAR技術が欲しかった!スマホをかざすだけでプロ並みのスケッチを描ける「SketchAR」アプリを使ってみた!
share0
こんなAR技術が欲しかった!スマホをかざすだけでプロ並みのスケッチを描ける「SketchAR」アプリを使ってみた!
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
share0
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
share0
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
1枚の写真だけで超リアルな3D顔面をWeb上で高速生成できる「3D Face Reconstruction」を使ってみた!
share0
1枚の写真だけで超リアルな3D顔面をWeb上で高速生成できる「3D Face Reconstruction」を使ってみた!
「docs・Wiki・task」が融合した超軽量Webエディタ「Notion」の潜在能力が高過ぎる件!
share0
「docs・Wiki・task」が融合した超軽量Webエディタ「Notion」の潜在能力が高過ぎる件!
思わずWeb開発したくなる最強のJavaScriptライブラリ7選が楽し過ぎてヤバイ!
share0
思わずWeb開発したくなる最強のJavaScriptライブラリ7選が楽し過ぎてヤバイ!
スマホのタッチ操作に最適化されたWebアンケートが作れるサービス「Wyzerr」を使ってみた!
share0
スマホのタッチ操作に最適化されたWebアンケートが作れるサービス「Wyzerr」を使ってみた!
今すぐブラウザ上に「ライブ配信」のスタジオ環境をタダで構築できる「Lightstream」を使ってみた!
share0
今すぐブラウザ上に「ライブ配信」のスタジオ環境をタダで構築できる「Lightstream」を使ってみた!
データ可視化の最強ツール!Web上でスライド資料やインフォグラフィックを制作できる万能Webエディタ「Visme」を使ってみた!
share0
データ可視化の最強ツール!Web上でスライド資料やインフォグラフィックを制作できる万能Webエディタ「Visme」を使ってみた!
ブラウザ上でサイト構成図(マップ)を作成して複数人とコラボ連携可能な「FlowMapp」を使ってみた!
share0
ブラウザ上でサイト構成図(マップ)を作成して複数人とコラボ連携可能な「FlowMapp」を使ってみた!
エアフォースワンの内部もVR空間に!Web上であらゆる場所を歩き回れる「Matterport 3D Gallery」の没入感がスゴイ!
share0
エアフォースワンの内部もVR空間に!Web上であらゆる場所を歩き回れる「Matterport 3D Gallery」の没入感がスゴイ!
ブログ感覚でWebアプリやサイトの更新履歴を作成&公開できる「Barelog」を使ってみた!
share0
ブログ感覚でWebアプリやサイトの更新履歴を作成&公開できる「Barelog」を使ってみた!
スクショ付きでブックマークを一元管理できるWebアプリ「Bookmark OS」を使ってみた!
share0
スクショ付きでブックマークを一元管理できるWebアプリ「Bookmark OS」を使ってみた!
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
share0
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
ブラウザから即起動!ゼロからSVG画像を作成できるWebエディタ「Vectr」が完全無料で公開中!
share0
ブラウザから即起動!ゼロからSVG画像を作成できるWebエディタ「Vectr」が完全無料で公開中!
匿名もOK!SkypeでWebコードエディタを共有できる「Interviews on Skype」が無償公開中!
share0
匿名もOK!SkypeでWebコードエディタを共有できる「Interviews on Skype」が無償公開中!
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...

ページトップへ戻る