O slideshow foi denunciado.
Utilizamos seu perfil e dados de atividades no LinkedIn para personalizar e exibir anúncios mais relevantes. Altere suas preferências de anúncios quando desejar.

キーボードアプリとSketchのススメ

1.302 visualizações

Publicada em

キーボードアプリ作りとデザインツールとしてのSketchについて.

Publicada em: Tecnologia
  • Hello there! Get Your Professional Job-Winning Resume Here! http://bit.ly/topresum
       Responder 
    Tem certeza que deseja  Sim  Não
    Insira sua mensagem aqui

キーボードアプリとSketchのススメ

  1. 1. Sketch! Sketch! Sketch! Design&Tools Yuichi Yoshida Chief engineer, DENSO IT Laboratory, Inc. #yidev @sonson_twit © 2014YuichiYoshida, All rights reserved. Redistribution or public display not permitted without written permission from YuichiYoshida. Sketchでデザインしたキーボードアプリを作ってみた
  2. 2. 自己紹介 2tchの中の人 • iOS好きです • 2tch(2ちゃんねるビューア) • iOS SDK Hacksなど • 研究・開発 • コンピュータビジョン • 機械学習 • 画像検索サービスとか • 車向けサービスやハードウェアとか
  3. 3. 今日のお話 • キーボードアプリ • App Groups - CoreData - iCloud • カスタムフォント • その他 • Sketch • 何がいいのか • 何が悪いのか • 非デザイナにとってのSketch
  4. 4. AAKeyboard
  5. 5. Demo AAKeyboard
  6. 6. メイン機能 • AAキーボード • Safariからの登録機能 • アプリからAAを編集 • iOS8の新機能を色々組み込んで作ってみた
  7. 7. データの共有方法 • App Groups • App, Keyboard, Actions - 同一グループを指定 • キーボードはフルアクセスが必要 • CoreData via App Groups • App Groupsを使って共有可能 • 同期は完璧っぽい • CoreData on iCloud via App Groups • 更新が遅い・・・?
  8. 8. フルアクセス?ーApp Groupsを使う場合 NSError *error = nil; NSFileManager *fm = [NSFileManager defaultManager]; NSString *containerPath= [[fm containerURLForSecurityApplicationGroupIdentifier:@"group.com.sonso n.AAKeyboardApp"] path]; [fm contentsOfDirectoryAtPath:containerPath error:&error]; if (error != nil) { return NO; } return YES;
  9. 9. カスタムフォント • Keyboard, Actionともに普通に使える
  10. 10. 作った人に聞きたい! • キーボードのAutolayoutの挙動が全体的に変 • なんか,ヘンなんです • Action Extensionのときのキーボードの処理 • UIApplicationを使えない→keyWindowがとれない • キーボードに数字キーは必要なの? • fuckin’review and guidelines • キーボード・フルアクセスかをバンドル元のアプリか ら調べる方法
  11. 11. Sketch
  12. 12. 唐突ですが • デザインしてますか? • 画面設計,アイコン,アプリアイコン・・・ • どんなツールで? • 人に依頼してる? • 自力で?
  13. 13. Sketchって何? • 最近流行ってきたドローツール? • Apple Watchのテンプレートの形式に採用された • ベクトルグラフィクス • UIデザインをメイン作業として設計されている • AAKeyboardのUI, アイコンのデザインに利用 • 今日は,それに当たってのよかったところを紹介
  14. 14. デザインの雄 • 機能大杉 • 高杉 • 汎用 よくも悪くもプロの汎用ソフトウェア.
  15. 15. 新参者ですが • 機能がそこまでない • 9800円安い • UI設計用 • ピクセルベースで合わせやすい ある程度目的特化型の方がいい面もある
  16. 16. デザインの方法 • 用意された部品で画面を構成していく
  17. 17. デザインの方法 • 用意された部品で画面を構成していく
  18. 18. 位置測るのも楽
  19. 19. ピクセルベースの確認も一発
  20. 20. ピクセルベースの確認も一発 ベクトルグラフィクスでありがちな中途半端な位置に置いて アンチエイリアスのせいでぐちゃぐちゃ不祥事案件回避
  21. 21. 確認は実機で Sketch Mirror
  22. 22. 右上のボタンを押すだけで・・・・
  23. 23. もちろん,書き出しも一括
  24. 24. 倍率と名前を設定できる
  25. 25. まとめ • キーボードアプリでできること • App Groups • CoreData共有 • カスタムフォント • Sketch.app • デモ • デベロッパにお勧め • 色々機能

×