スマートフォン懇親会#14に参加してきた
高見さん主催のスマートフォン懇親会に参加してきた。
スマートフォンについてユーザ寄りの情報交換をする集まり。
詳細は3月30日 スマートフォン懇親会横浜#14(神奈川県)を参照。
ココチのよいスマホサイトの作り方 モカさん
自己紹介
Webページの修正をやっている。 プログラミングはできないが、借りてきたコードを書きかえてbotを作っている。 端末はAdvanced W-ZERO-3[es]
スマホページ作成の大変さ
- 1ページあたりに入れられる文字情報が少ない
- 携帯のように十字キーでスクロールができない。静電式が主流のため、タップしやすいよう大きめのボタンを作る必要がある
- PCサイトの情報は、せっかくなので、画像も含めてなるべく多く載せたい。
PCだとひとまとめにして閲覧できるページをスマートフォン対応させようと思うと、ページを分割する必要がある。
結果的にページが異様に多くなってしまう。
スマホのページ修正のここが大変！
ページ数が多いと
- 作成の手間がPCサイトやモバイルサイトの倍になる
- 修正の際のファイル名を辿るのに手間
- 修正の際のファイルの個数が多い
PCだと数ファイルの修正で終わるものが、スマホっさいとだと数十倍から数百倍に膨れ上がってしまう。
携帯サイトの場合は、画像をあまり貼らないうえ、スクロールがしやすいので、多少、長くなっても大丈夫。
よくある修正3パターン
- 画像を修正すればよい場合 例：キャンペーン告知 PCサイトの画像にリンクしておき、必要な画像だけ差し替え
（打ち損ねた）
こうするとよいと思う点
- フォルダ構成はなるべくPCサイトに準じる
- 更新するとき、わかりやすく間違えないため
- ファイル名は見直しやすく、かつ長いものに
- 該当PCのファイル名に番号を振っていく（hoge_index.html、hoge_index01.htmlなど）ほうが無難ではないか
- メルマガの文中、Facebookの記事などの中のURLを、PC、スマホ、携帯で統一感があるものにしたい。
- 見栄えが悪い
スマートフォン基準でサイトを作ってはどうか
これからWebサイトを作るのであれば、スマホサイトを先に作って、それを一括表示した物がPCサイト、一括表示して画像を削ったものが携帯サイト、といった風に。
長文では書かず、簡潔でわかりやすい文章にして、見やすくする。
課題：タブレットの扱いはPCで良いのか
PC? スマートフォン?
ところで
電車を見渡してみると、スマートフォンでLINEやTwitterを利用している人が目立つ。
小学生ぐらいのお子さまもLINEをしている。宛先が選びやすく、メールよりも扱いやすいから。
要するにわかりやすく、対話式かリアルタイム更新型で余分な機能がないものが受けるのか?
もしも、LINEやTwitterのデザインを流用した企業向けWebサイトを作ったらどうなるのか?
見た目は吹き出し型か、アイコン＋140字以内がよいのでしょうか?
こぞって皆がそのレイアウトをつかうような、もてはやされるような、スマホサイトの定番UIというものがでてくるかも。
クイックホイールのようなインターフェースがあると面白いのではないか。
てんぷれ
とあるECサイトではテンプレートが用意されているので作成が簡単。
テンプレートがあると効率がよいので、必要事項のみ管理画面で入力すればよい。実際の反映前に簡単なテストページが作成できる！ 自動でURLが発行される! というような仕組みが作られると良いなー
関連
高見さんから
レスポンシブルWebデザインといって、画面解像度に応じてCSSを切り替えることができる。
注意点としてはViewPortというプロパティがあり、適切な値に設定する必要がある。
レスポンシブルWebサイトでは任意のスタイルに切り替えができない為、スマートフォンでPCのスタイルで表示したい人などには不向き。
スマートフォン教室体験談 高見知英さん
自己紹介
- 高見知英
- 職業
- 個人事業主登録見込み
- Android開発書籍作成
- アプリ開発
- ITコミュニティ
- いくつかの会に所属している
スマートフォン教室
- 浜小学校コミュニティハウス
- 初心者向け教室
- 見学あり
なぜこんなことを？
- 見学あり
- パソコン教室の延長
- スマートフォン詳しい人いない? という話から白羽の矢が立った。
- 地域とITコミュニティの橋渡しの一環
- 町の先生に登録（各区の講師派遣のためのプログラム）
- 1年くらいで自主事業依頼
- そのまま定例教室化
- 小額だがお金をもらっている
授業内容
- OSは何かといった基本的な知識
- アカウントについてそれぞれの特徴
- スマートフォンのデメリット
- 料金・電池・セキュリティなど
カリキュラム
- 2日にわけて実施
- 1日3時間
- 1時間 A3資料2P
設備
こんな感じだから
- 今まで地域ではできなかった
- 端末が確保できないなど問題があった
- OS/UIが違う！
- PC教室でなれている
- スマートフォンがばらばらなのはざらだし
- なれてもらうためにもUIを統一せずに実施
持ち込みOKにしたら
形式
- 資料読み上げ+質疑応答
- 適宜、実習を挟む
- 実習では端末に触ってもらう
- 質問は多かった
対応限界
- 9人はやばい
端末のデモ
- やっぱり必須
- 後半は欠席者もあったのでなんとかなった
- できればPC画面に投影
- ワイヤレスadbとか?
- Android Mirror USBアダプターとか?
Android推し?
- 途中まで「Androidいいよね」な状況に
- iPhoneもいいですよ、と推していく状態
- Windows Phoneが受けた
- IS12Tをみて「これいいね」と評価が高かった
- だから、はやく出してください。MSさん、キャリアさん。
スマートフォン推し?
- 電話できないとね、という空気があった。
- 他のイベントだと可読性からタブレット推しが多かった
SIMフリーいいの?
- 意外と抵抗はなさそう
- カタログ持っていけばよかったかもしれない
- 販売店と合同がよかった
- b-mobileなどとあわせて提示?
2日にわけることの難点
- 後半は欠席率が高い
- 1日目で終わると思う人が多かった
- 次回予告した方がよかった
- 前半基本・後半応用
- 完全に分離して進めたい
操作方法の説明
- 1日目と2日目で使う端末が違う
- ロック画面の解除方法
- ホーム画面の基本
- 見知らぬ端末を使えるように
アカウントの概念
- なくても問題ないが……。
- 持ち込みの人もGoogleアカウント未登録だったりする
- 早いうちに教えておくべきだった
電池切れとか
- ものによってはすぐに電池が切れる
- バッテリー持ちがよい機種に限定するか考え中
まとめ
- 内容はよかった
- 順番を並び替えてまた実施
- ニーズはたくさんある模様
- 場所さえあればやれそう
- 自主事業としてやってみたい?
- 販売店やメーカーとのコラボも?
次回
- スマートフォン勉強会@関東#最終回
- 傾向と対策・経緯などを含めてお話しします
雑談
子供がネットにふれる機会
パソコンや携帯電話に限らず、各種ゲーム機でも繋げられる。iPod touchなどもそう。
親が認識していない手段がたくさんある。
どうやってWebの長所と短所を子供に教えるか
加減が難しい。
短所だけ言っても長所だけ言っても、実態を知ってもらえない。
