Smart Canvasで作るWebサイト

2013年7月
Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
http://smartcanvas.net/

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
http://smartcanvas.net/
「プログラミング無しでWebアプリを作成」
スマートフォンWebアプリ 作成ツール
Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
Smart Canvasで出来ること

項目

出来る?

アニメーション

○

画面遷移

○

サーバー通信

×

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
Smart Canvas

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
Smart Canvas

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
Smart Canvas

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
まずは登録
①ブラウザでhttp://smartcanvas.net
にアクセス
※是非「いいね」してください
②会員登録

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
新規作成
①マイページの「新規作成」ボタンを押して、
新しいアプリを作る

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
アイテムの配置
① 基本アイテムを選択
② 基本アイテムをドラッグ&ドロップ
テキスト
ドラッグ&ドロップ

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
プロパティの設定

① 位置・サイズを調節します

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
他の要素の設定
背景色

透明度
Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日

文字色
アニメーションの設定
① アニメーションタブを選択
② アニメーション作成ボタンを押す

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
アニメーションの設定
アニメーション
条件

起動
タップ

対象
変化値

変化量
Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日

x,y座標
透明度・角度
アニメーションの設定 具体例
アニメーション
条件
アイテム1をタップ

対象

アイテム1

変化値
x座標を90px

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
プレビュー

プレビューを選択

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
プレビュー確認
タップ(クリック)

アニメーション!

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
画像のアップロード
選択

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
画像のアップロード
選択

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
ページの追加

ページ追加を選択

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
ページの追加

全体モードを選択

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
ページの追加

ページの追加を確認
Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
アイテムにページのリンクを貼る

アイテムにリンク
が張られている状態

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
リンクの確認

プレビューを選択

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
リンクの確認
タップ(クリック)

ページ遷移

Copyright © 2013 / HITOKUSE Inc
13年11月17日日曜日
是非面白いアプリをいっぱい作って下さい!
本日はありがとうございました!

13年11月17日日曜日
Upcoming SlideShare
Loading in …5
×

【ヒトクセ】Smart canvasの使い方

1,018 views
852 views

Published on

Smart Canvasの使い方の説明資料です。

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,018
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

【ヒトクセ】Smart canvasの使い方

  1. 1. Smart Canvasで作るWebサイト 2013年7月 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  2. 2. http://smartcanvas.net/ Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  3. 3. http://smartcanvas.net/ 「プログラミング無しでWebアプリを作成」 スマートフォンWebアプリ 作成ツール Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  4. 4. Smart Canvasで出来ること 項目 出来る? アニメーション ○ 画面遷移 ○ サーバー通信 × Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  5. 5. Smart Canvas Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  6. 6. Smart Canvas Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  7. 7. Smart Canvas Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  8. 8. まずは登録 ①ブラウザでhttp://smartcanvas.net にアクセス ※是非「いいね」してください ②会員登録 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  9. 9. 新規作成 ①マイページの「新規作成」ボタンを押して、 新しいアプリを作る Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  10. 10. アイテムの配置 ① 基本アイテムを選択 ② 基本アイテムをドラッグ&ドロップ テキスト ドラッグ&ドロップ Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  11. 11. プロパティの設定 ① 位置・サイズを調節します Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  12. 12. 他の要素の設定 背景色 透明度 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日 文字色
  13. 13. アニメーションの設定 ① アニメーションタブを選択 ② アニメーション作成ボタンを押す Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  14. 14. アニメーションの設定 アニメーション 条件 起動 タップ 対象 変化値 変化量 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日 x,y座標 透明度・角度
  15. 15. アニメーションの設定 具体例 アニメーション 条件 アイテム1をタップ 対象 アイテム1 変化値 x座標を90px Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  16. 16. プレビュー プレビューを選択 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  17. 17. プレビュー確認 タップ(クリック) アニメーション! Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  18. 18. 画像のアップロード 選択 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  19. 19. 画像のアップロード 選択 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  20. 20. ページの追加 ページ追加を選択 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  21. 21. ページの追加 全体モードを選択 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  22. 22. ページの追加 ページの追加を確認 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  23. 23. アイテムにページのリンクを貼る アイテムにリンク が張られている状態 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  24. 24. リンクの確認 プレビューを選択 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  25. 25. リンクの確認 タップ(クリック) ページ遷移 Copyright © 2013 / HITOKUSE Inc 13年11月17日日曜日
  26. 26. 是非面白いアプリをいっぱい作って下さい! 本日はありがとうございました! 13年11月17日日曜日

×