SlideShare a Scribd company logo
1 of 26
Download to read offline
iOSアプリ開発で意識すると役立ちそうな

「つなぎ目」の部分について
YUMEMI.swift	#7	@	オンライン
2020/05/15
Fumiya	Sakai
自己紹介
・Fumiya	Sakai
・Freelance	iOS	Engineer
アカウント:
・Twitter:	https://twitter.com/fumiyasac

・Facebook:	https://www.facebook.com/fumiya.sakai.37

・Github:	https://github.com/fumiyasac	

・Qiita:	https://qiita.com/fumiyasac@github
発表者:
・Born	on	September	21,	1984
これまでの歩み:
Web	Designer
2008	~	2010
Web	Engineer
2012	~	2016
App	Engineer
2017	~	Now
iOSのUI実装本を執筆しています!(新刊構想中…)
少しの工夫で実現できるTIPS集 ライブラリ表現の活用集
書籍に掲載したサンプルのバージョンアップや続編等に現在着手中です。
技術書典8(応援祭)で電子版だけ頒布した書籍紹介
前回及び前々回に頒布したものの中で書籍に載せきれなかったものを紹介
第1章:	メディアアプリ型のUI	
第2章:	構造が複雑な写真表示UI
記事一覧を無限スクロールする様な形のアプリ
UIを一覧/詳細表示を簡素化した実装を紹介。
現在はBoothにて販売中です! https://booth.pm/ja/items/1835468
¥1,000	-	iOSアプリ開発「UI実装であると嬉しいレシピブック	まかない編」
サンプルコードはこちら:	https://github.com/fumiyasac/meals_ios_ui_recipe_showcase
第3章:	Combine	+	UICollectionViewCompositionalLayout
タイル状のフォトギャラリーや一覧表示型のア
プリUIでライブラリを活用した実装を紹介。
実務でも利用&考察したもの
特に第1章と第2章の内容に関し
ては、実際に相談されたり、実
装アイデアとして活用する機会
があったものになります。
今回の発表における「つなぎ目」とは?
iOSアプリを実装する上での「つなぎ目」という言葉が示す部分の例
(1)	SwiftやXcodeで実現する以外の部分とつなげるための実装が必要となる部分
⭐ 	バックエンド側のAPI通信に関わる部分紹介する具体例:	
(2)	実現するために結節点となる実装が必要となる部分
⭐ 	少し複雑になりそうなUI実装に関わる部分紹介する具体例:	
これ以外にももっと細かく挙げていけばたくさんありますが、本発表ではこの3つに関して解説できればと思います。
(3)	iOSアプリ開発をする上で必要な周辺知識の部分
⭐ 	Push通知関連の知識に関わる部分紹介する具体例:
何故に「つなぎ目」の部分を意識すると良いのか?
技術要件を満たすと同時に関係するセクションとの円滑なやり取りのため
ビジネスサイドからの

要望の実現可否
iOSアプリに限らず昨今の高機能化や深くプロダクトに携わる中で必要な知識や知見は増えていく。
様々な場面でiOSアプリを開発する上で「つなぎ目」となる部分の知識や知見の大切さを感じるタイミングはあるはず。	
📱 アプリ利用ユーザーからの
お問い合わせの原因調査
Web	/	Android	等の他deviceと
比べた時の違いの見極め
デザインとの兼ね合いや

Animation	/	Interaction
バックエンド側で提供している

API通信処理との連携対応
内部アーキテクチャや継続的
なデリバリー環境の整備
高機能化・複雑化
機能開発・改善・保守
iOS	App
(1)	SwiftやXcodeで実現する以外の部分と

つなげるための実装が必要となる部分
バックエンド側のAPI通信との「つなぎ目」の事例紹介
API通信との「つなぎ目」となる部分の実装(1)
スクロールの最下部に到達した際に次の表示要素を読み込む場合
(1)	has_next_page:	Bool	→	次ページが取得可否 (2)	current_page:	Int	→	取得データのページ番号
// MEMO: NSCollectionLayoutSectionのScrollではUIScrollViewDelegateは呼ばれない
func scrollViewDidScroll(_ scrollView: UIScrollView) {
// MEMO: UIRefreshControl表示時は以降の処理を行わない
if mainRefrashControl.isRefreshing { return }
// MEMO: UIScrollViewが一番下の状態に達した時にAPIリクエストを実行する
if scrollView.contentOffset.y + scrollView.frame.size.height > scrollView.contentSize.height {
viewModel.inputs.fetchPhotoTrigger.send()
}
}
@Query(value	=	"SELECT	*	FROM	articles	ORDER	BY	id	DESC	LIMIT	:limit	OFFSET	:offset"	,	nativeQuery	=	true)
UIScrollViewDelegate	&	UIRefreshControlを利用したハンドリングiOS:	
paginationを伴ったデータの取得Backend:	
レスポンスのJSONに一覧データと一緒に必要なもの
API通信との「つなぎ目」となる部分の実装(2)
画像サムネイルの比率に合わせてセルの高さが変化するMaisonryLayout
生成時にModel内に比率を
持つ構成にしておき、レ
イアウト生成時に適用。
●●●●●●●●●●●●●●
●●●●●●
△△△△△△△△△△△△△△
△△△△△…
2行固定
2行固定
写真の

縦横比に

合わせる
(1)	データを表示するためのAPIレスポンス内に写真の縦横比を計算す
るための値を持っておく。
(2)	NSCollectionLayoutSectionを作成する処理を実行する際にに表示
用データを利用した写真の縦横比を基く高さ計算ロジックを仕込んで
おく。
{
"id": 1, “title": "タイトルが入ります。",
"summary": "概要が入ります。",
"image": {
"url": "...(画像のURL)...",
"width": 425, "height": 640
},
"gift": { "flag": false, "price": null }
}
セルに表示するJSONデータの抜粋
処理のポイント
補足:	
レイアウト構築時に画像
から縦横比計算するとパ
フォーマンスに難あり。
前述したサンプルの紹介及び活用しているもの
最低限のMasonryLayoutをiOS13〜のトピックスを用いて実装したもの
利用している技術
Mock用ツール
⭐ 	サンプルリポジトリ:	https://github.com/fumiyasac/DiffableDataSourceExample
・MVVM	Architecture
・UICollectionViewCompositionalLayout
・Combine	Framework
・NSDiffableDataSource
・json-server
API通信のMock	&	正常系Check
API通信部分の振る舞いを再現する
API通信に関するやり取りを効率化するための工夫
Mockツールの活用を採用したり、Swagger等を活用する方針も良さそう
例.	Postman
https://bit.ly/3cpbqas
APIの開発がむちゃくちゃ捗る「Postman」の使い方
例.	GoDoc	+	Swagger
https://github.com/swaggo/swag
Swag	(API定義の整理)
⭐ 	Go	&	Swaggerのサンプルリポジトリ:	https://github.com/fumiyasac/SampleApiOfGo
どちらの担当とする方が運用しやすいか?	デザインや構造としての負担が少ないか?	等を考える材料となるかを考えると良い
(2)	実現するために結節点となる実装が必要となる部分
UI実装における「つなぎ目」の事例紹介
デザインから紐解ける疑問点や気づきをまとめる
実装の際に気をつけるべき点を洗い出しておけば相談もしやすくなる
・小さい画面でも表示できるようにUIScrollViewを利用する
デザインを見た際に気をつけられそうな部分
さらにもう一段「深く読んでみて」気をつけられそうな部分
・フォーム要素の部分に入れる文言のうち高さ可変になりえる部分がある
・キーボードが表示されている時に表示要素が隠れないようにする
・パスワードの表示と非表示が切り替えることができる
・入力部分は1つのViewに切り出して使いまわせるようにできないか?
・利用規約	/	プライバシーポリシーは外部リンクまたはアプリ内か?
・エラーメッセージ表示のタイミングは入力中に表示する形か?
・キーボードを閉じるのは表示中にUITaxtField以外のタップ時した時か?
・サインアップボタンを有効にするのは全ての値が正しい時か?
平素の業務で利用しているものを深く知る
ここではUIライブラリ:SnapKitでの例を紹介します
View同士の親子関係を利用してAutoLayoutを付与…	親View
…	子View 親Viewの中に子ViewをaddSubViewで追加して制約を付与
①	GUIよりもViewの重なり方には注意する。
SnapKitレイアウト概論(1): GUIを利用しないAutoLayoutに慣れて頂く
10
24
contentView.addSubview(childView)
childView.snp.makeConstraints { make in
make.top.equalToSuperview().offset(10.0)
make.right.equalToSuperview().offset(24.0)
make.left.equalToSuperview().offset(24.0)
make.bottom.equalToSuperview().offset(10.0)
}
任意のViewに対して、上下左右の
AutoLayout制約を付与する場合の実装
パターン
24
10 CenterX
CenterY
200
280
contentView.addSubview(childView)
childView.snp.makeConstraints { make in
make.centerX.equalToSuperview()
make.centerY.equalToSuperview()
make.height.equalTo(200.0)
make.width.equalTo(280.0)
}
任意のViewに対して、

中央寄せの位置関係と幅・高さの
AutoLayout制約を付与する場合の
実装パターン
全ての制約をコードで付与する形なのでGitで
の差分が見やすい等のメリットがある
平素の業務で利用しているものを深く知る
ここではUIライブラリ:SnapKitでの例を紹介します
View同士の親子関係を利用してAutoLayoutを付与…	親View
…	子View 親Viewの中に子ViewをaddSubViewで追加して制約を付与
②	Animation時は実装がつらい場合がある。
SnapKitレイアウト概論(2): レイアウトを組み立てる上で頻出の表現
SnapKitで付与したAutoLayout制
約に対してアニメーションを実行
する場合
移動前
移動後
self.layoutIfNeeded()
self.targetConstraint1?.activate()
self.targetConstraint2?.deactivate()
予め決めておいた制約値を適用・除外する
UIView.animateメソッドの中で制約の適用を実行
UIStackViewを利用した配置について
(SnapKitとは直接関係はないがよく
利用する部分)Child	2
Child	1
contentsStackView.addArrangedSubview(contentView1)
contentsStackView.addArrangedSubview(contentView2)
contentView1.removeFromSuperview()
contentView2.removeFromSuperview()
UIStackViewの中に別途配置したView要素を追加する
View要素をUIStackViewから削除する
制約の変更だけでは困難なアニメーションの場
合には、ライフサイクルを活用
ライブラリを利用するか?自前で作るか?の選択
自前で実装する場合の方針を理解しながらライブラリを上手に活用する
https://github.com/zenangst/Blueprints
⭐ 	Blueprints:
https://github.com/rechsteiner/Parchment
⭐ 	Parchment:
iOS13〜のUICollectionViewCompositionalLayoutを
利用する、ないしはUICollectionViewLayoutを継承
したレイアウト用のクラスを利用する方法となる。
自前で実装する場合の方針
タブ下のコンテンツを表示するためのエリアに関し
てはUIPageViewControllerを利用する。タブ表示部
分はUICollectionViewやUIScrollViewを利用する。
自前で実装する場合の方針
複雑なView構造を考えていく場合の例
満たすべき理想形やデザインから読み取れる情報も基にして決めていく
どの方針を採用するか? 実際の構造事例
単一のUICollectionViewで実装
・UICollectionViewCompositionalLayout
・UICollectionViewCellに別画面を表示
・UIScrollView内にContainerViewを表示
画面を分割して実装
⭐ 	デザインから紐解いた仮説
・スクロール最下部到達時の読み込み有無
・PullToRefreshの有無と更新対象範囲
実際の理想形から構造を考えていく
①
②
③
④
⑤
⑥
①
③
⑤
②
④
⑥
試してみる・作ってみる経験の中で得られるもの
UICollectionViewCompositionalLayoutを使っても難しそうなレイアウト例
自分なりに考察してみる
UICollectionViewCompositionalLayoutを利用しても実
現がしにくい場合はどんな時か?
・タイマーで切り替えるカルーセル型のUI構築時
・セルの変形処理やアニメーション処理をセルの
スワイプ実行時に付与する必要なUI構築時
・無限循環型のスクロールは必要なUI構築時
⭐ 	試した物の積み重ねが実務で役に立つことがある
簡単でも良いので自分で試した経験や知見を大切に!
この並び方の実装であれば

比較的簡単に実現可能。
この並び方の実装であれば

難しそうな気がした。
UICollectionViewLayoutで作る方針でも良さそう
(3)	iOSアプリ開発をする上で必要な周辺知識の部分
Push通知まわりの知識に関する「つなぎ目」の事例紹介
Firebaseを利用したPush通知基盤例
Firebase	Cloud	Messagingとの連携やデバイストークンまわりの処理がポイント
Server
アプリ起動時における処理の流れ
①	registerRemoteNotification()実行
※この部分はAppDelegate.swiftで実施	(MessagingDelegate)
②	デバイストークンを受け取る ③	デバイストークンをサーバーへ登録する
プッシュ通知許可
この時に表示されるリモートプッシュ通
知の許可ダイアログはFCMに対して実行す
るもの。
補足:	
※①〜③は起動時に毎回実施される処理 DBにUserのに紐づ
くDeviceTokenを
保持しておく。
初回起動時
GoogleAPIを介してFCMへ
Push通知送信処理を実行
📱
Push通知を受信する
後は内容に応じた処理を実施
APIsのサービスアカウン
トキーの作成及び管理
送信処理

実行
iOS	App
AWSを利用したPush通知基盤例
Amazon	SNS	&	AWS	Lambdaを利用した場合のPush基盤設計の例です
※この部分はAppDelegate.swiftで実施	(UNUserNotificationCenterDelegate)
初回起動時 ①Push通知で送る内容
を組み立ててLambdaを
実行
②SNSの処理を実行して
APNsへPush通知を送信
📱 APNs
送信処理実行
Push通知を受信する
後は内容に応じた処理を実施
iOS	App
アプリ起動時における処理の流れ
①	registerRemoteNotification()実行
②	デバイストークンを受け取る
プッシュ通知許可
この時に表示されるリモートプッシュ通
知の許可ダイアログはFCMに対して実行す
るもの。
補足:	
③	デバイストークンをサーバーへ登録する
※①〜③は起動時に毎回実施される処理
Server
DBにUserのに紐づ
くDeviceTokenを
保持しておく。
Push通知の証明書に関連する知識の整理
Push通知の証明書まわりの知識はなかなか整理する大変さを感じる部分
例.	p8ファイルとp12ファイルに関する違いを整理する
・AppleDeveloperでadmin権限が必要
・1度作成してしまえば有効期限は無制限
・最大2個までしか作成ができない
・1つのp8ファイルで複数のAppに対応が可能
Firebase	Cloud	Messagingでの設定
・p8ファイルをUpload
p8ファイル作成時に取得する
TeamIDとKayIDを記載する
⭐ 	設定手順:	https://qiita.com/matsuyoro/items/77408e5d09ef00be8577
・1年の有効期限があるので都度更新が必要
・APNs証明書のキーチェーン登録等の付随作業がちょっと大変
Amazon	SNSでの設定
・p8ファイルは非対応
p8
p12 開発用&本番用2つのp12ファ
イルが必要になる
⭐ 	設定手順:	https://qiita.com/natsumo/items/d5cc1d0be427ca3af1cb ※UNUserNotificationCenterDelegate
※MessagingDelegate	(iOS10~)
まとめ
実装や周辺知識における「つなぎ目」の意識でより仕事がしやすくなる。
1.	インプットとアウトプットを自分の言葉でまとめて試してみるのが初めの1歩:
様々な知識や最初はなかなか難しく感じてしまう部分があるかもしれない。

業務以外で少しずつできそうな所からまずは試して、ある程度の所まで形にして、その道のりをまとめると良いと思います。
2.	技術面でも自分が得た知識や知見を可視化する:
自分にとっては些細に感じそうな部分ではあっても、他人からみるとそうではないことがある。

僕が意識的にやっているのは「ノートに書き出す」ことと「ドキュメントの整備」の2つはなるべくするようにしています。
まだまだ社会的に大変な時期ではありますが、僕自身もこれ以降の新しい取り組みができるようにしていく次第です。
3.	お互いが「優しい気持ち」の状態で開発に取り組んでいけるための心理的安全:
ともすると「つなぎ目」に関わる実装に関する部分は、コミュニケーション面でも連携が必要な部分。

少しでもお互いが「優しい気持ち」となる状態を作り出すための部分も立派なエンジニアとしての仕事と考えています。
おまけ:その1
少しのヒントがあるだけでグッと考えやすくなるアプローチの例
考えやすくするためのヒントをつける
(問題)円周率は3.05より大きいことを示せ
(問題)円周率は3.05より大きいことを示せ
※	ただし、1.73	<	√3	<	1.74であることを用いても良い
本題を解くための準備となる形にする
(問題)tan1°は有理数か
(問題)次の問いに答えよ
(1) tan(α+β)	=	(tanα+tanβ)	/	(1-tanαtanβ)を証明せよ
(2) tan1°が無理数であることを背理法を用いて証明せよ
全く方針が立たなそうな問題であっても少し形を変える	→	考えやすい形にもっていくことができれば解きやすくなる
理解するためのヒントとなる部分や考えていくための道のりを整理する手段がドキュメントの役割と考えています。
ここで紹介している数学の問題はどちらも「解き方に気付く&証明方針を思いつくまでが難しい」問題だと思います。
おまけ:その2
過去に登壇した資料の中で同じようなことに触れているものの紹介
できることや新たな知識が増えていくことは、自分にとっても他人にとっても嬉しいこと。
今回の事例と併せてこのような形で「つなぎ目」の部分に触れていくのも良いかもしれません。※もうちょっと詳細実装寄り
⭐ 	発表資料:	https://www.slideshare.net/fumiyasakai37/webiosswift
Thank	you	for	listening	!

More Related Content

What's hot

アプリ開発におけるテキスト装飾のアイデア集
アプリ開発におけるテキスト装飾のアイデア集アプリ開発におけるテキスト装飾のアイデア集
アプリ開発におけるテキスト装飾のアイデア集Fumiya Sakai
 
少しずつキャッチアップしていくAndroidアプリ開発
少しずつキャッチアップしていくAndroidアプリ開発少しずつキャッチアップしていくAndroidアプリ開発
少しずつキャッチアップしていくAndroidアプリ開発Fumiya Sakai
 
動画プレイヤーアプリの開発を通じて学んだ機能を実現するための要点解説
動画プレイヤーアプリの開発を通じて学んだ機能を実現するための要点解説動画プレイヤーアプリの開発を通じて学んだ機能を実現するための要点解説
動画プレイヤーアプリの開発を通じて学んだ機能を実現するための要点解説Fumiya Sakai
 
デザイナー→Webエンジニア→iOSエンジニアと渡り歩いた僕なりのSwiftとの向き合い方と生かす戦略
デザイナー→Webエンジニア→iOSエンジニアと渡り歩いた僕なりのSwiftとの向き合い方と生かす戦略デザイナー→Webエンジニア→iOSエンジニアと渡り歩いた僕なりのSwiftとの向き合い方と生かす戦略
デザイナー→Webエンジニア→iOSエンジニアと渡り歩いた僕なりのSwiftとの向き合い方と生かす戦略Fumiya Sakai
 
iOSアプリUIとの触れ合いと歩む僕なりのSwiftの楽しみ方
iOSアプリUIとの触れ合いと歩む僕なりのSwiftの楽しみ方iOSアプリUIとの触れ合いと歩む僕なりのSwiftの楽しみ方
iOSアプリUIとの触れ合いと歩む僕なりのSwiftの楽しみ方Fumiya Sakai
 
部品に切り分けて考えるView構造とライブラリを上手に活用したUI実装
部品に切り分けて考えるView構造とライブラリを上手に活用したUI実装部品に切り分けて考えるView構造とライブラリを上手に活用したUI実装
部品に切り分けて考えるView構造とライブラリを上手に活用したUI実装Fumiya Sakai
 
ライブラリやView構造を有効活用して iOSアプリのUIをオシャレにするワザ紹介
ライブラリやView構造を有効活用して iOSアプリのUIをオシャレにするワザ紹介ライブラリやView構造を有効活用して iOSアプリのUIをオシャレにするワザ紹介
ライブラリやView構造を有効活用して iOSアプリのUIをオシャレにするワザ紹介Fumiya Sakai
 
RxSwiftとMVVMパターンと仲良くなる次のステップ
RxSwiftとMVVMパターンと仲良くなる次のステップRxSwiftとMVVMパターンと仲良くなる次のステップ
RxSwiftとMVVMパターンと仲良くなる次のステップFumiya Sakai
 
iOSのUI構築小技集(小さなとこから始められる編)
iOSのUI構築小技集(小さなとこから始められる編)iOSのUI構築小技集(小さなとこから始められる編)
iOSのUI構築小技集(小さなとこから始められる編)Fumiya Sakai
 
Approach of Prototyping for making Application User Interface about iOS
Approach of Prototyping for making Application User Interface about iOSApproach of Prototyping for making Application User Interface about iOS
Approach of Prototyping for making Application User Interface about iOSFumiya Sakai
 
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめできるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめFumiya Sakai
 
iOS側のUIの特徴と見比べるAndroid側でのUI実装のヒント
iOS側のUIの特徴と見比べるAndroid側でのUI実装のヒントiOS側のUIの特徴と見比べるAndroid側でのUI実装のヒント
iOS側のUIの特徴と見比べるAndroid側でのUI実装のヒントFumiya Sakai
 
SwiftとReactNativeで似たようなUIを作った際の記録
SwiftとReactNativeで似たようなUIを作った際の記録SwiftとReactNativeで似たようなUIを作った際の記録
SwiftとReactNativeで似たようなUIを作った際の記録Fumiya Sakai
 
Fundamentals of Swift & Redux (ReduxとSwiftの組み合わせ)
Fundamentals of Swift & Redux (ReduxとSwiftの組み合わせ)Fundamentals of Swift & Redux (ReduxとSwiftの組み合わせ)
Fundamentals of Swift & Redux (ReduxとSwiftの組み合わせ)Fumiya Sakai
 
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ(追加版)
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ(追加版)できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ(追加版)
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ(追加版)Fumiya Sakai
 
iOSアプリ開発のためのSwiftビギナーズ勉強会 第6回 @Co-Edo
iOSアプリ開発のためのSwiftビギナーズ勉強会 第6回    @Co-EdoiOSアプリ開発のためのSwiftビギナーズ勉強会 第6回    @Co-Edo
iOSアプリ開発のためのSwiftビギナーズ勉強会 第6回 @Co-EdoMegumi Otani(Czenhe)
 
ReactNative + Redux + NativeBaseでつくるサンプル実装をのぞく
ReactNative + Redux + NativeBaseでつくるサンプル実装をのぞくReactNative + Redux + NativeBaseでつくるサンプル実装をのぞく
ReactNative + Redux + NativeBaseでつくるサンプル実装をのぞくFumiya Sakai
 
少しずつ手厚くして不具合や仕様漏れを防ぐために
少しずつ手厚くして不具合や仕様漏れを防ぐために少しずつ手厚くして不具合や仕様漏れを防ぐために
少しずつ手厚くして不具合や仕様漏れを防ぐためにFumiya Sakai
 
まずはできるところから始める UnitTestとテストができる実装について
まずはできるところから始める UnitTestとテストができる実装についてまずはできるところから始める UnitTestとテストができる実装について
まずはできるところから始める UnitTestとテストができる実装についてFumiya Sakai
 

What's hot (20)

アプリ開発におけるテキスト装飾のアイデア集
アプリ開発におけるテキスト装飾のアイデア集アプリ開発におけるテキスト装飾のアイデア集
アプリ開発におけるテキスト装飾のアイデア集
 
少しずつキャッチアップしていくAndroidアプリ開発
少しずつキャッチアップしていくAndroidアプリ開発少しずつキャッチアップしていくAndroidアプリ開発
少しずつキャッチアップしていくAndroidアプリ開発
 
動画プレイヤーアプリの開発を通じて学んだ機能を実現するための要点解説
動画プレイヤーアプリの開発を通じて学んだ機能を実現するための要点解説動画プレイヤーアプリの開発を通じて学んだ機能を実現するための要点解説
動画プレイヤーアプリの開発を通じて学んだ機能を実現するための要点解説
 
デザイナー→Webエンジニア→iOSエンジニアと渡り歩いた僕なりのSwiftとの向き合い方と生かす戦略
デザイナー→Webエンジニア→iOSエンジニアと渡り歩いた僕なりのSwiftとの向き合い方と生かす戦略デザイナー→Webエンジニア→iOSエンジニアと渡り歩いた僕なりのSwiftとの向き合い方と生かす戦略
デザイナー→Webエンジニア→iOSエンジニアと渡り歩いた僕なりのSwiftとの向き合い方と生かす戦略
 
iOSアプリUIとの触れ合いと歩む僕なりのSwiftの楽しみ方
iOSアプリUIとの触れ合いと歩む僕なりのSwiftの楽しみ方iOSアプリUIとの触れ合いと歩む僕なりのSwiftの楽しみ方
iOSアプリUIとの触れ合いと歩む僕なりのSwiftの楽しみ方
 
部品に切り分けて考えるView構造とライブラリを上手に活用したUI実装
部品に切り分けて考えるView構造とライブラリを上手に活用したUI実装部品に切り分けて考えるView構造とライブラリを上手に活用したUI実装
部品に切り分けて考えるView構造とライブラリを上手に活用したUI実装
 
ライブラリやView構造を有効活用して iOSアプリのUIをオシャレにするワザ紹介
ライブラリやView構造を有効活用して iOSアプリのUIをオシャレにするワザ紹介ライブラリやView構造を有効活用して iOSアプリのUIをオシャレにするワザ紹介
ライブラリやView構造を有効活用して iOSアプリのUIをオシャレにするワザ紹介
 
RxSwiftとMVVMパターンと仲良くなる次のステップ
RxSwiftとMVVMパターンと仲良くなる次のステップRxSwiftとMVVMパターンと仲良くなる次のステップ
RxSwiftとMVVMパターンと仲良くなる次のステップ
 
iOSのUI構築小技集(小さなとこから始められる編)
iOSのUI構築小技集(小さなとこから始められる編)iOSのUI構築小技集(小さなとこから始められる編)
iOSのUI構築小技集(小さなとこから始められる編)
 
Approach of Prototyping for making Application User Interface about iOS
Approach of Prototyping for making Application User Interface about iOSApproach of Prototyping for making Application User Interface about iOS
Approach of Prototyping for making Application User Interface about iOS
 
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめできるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ
 
iOS側のUIの特徴と見比べるAndroid側でのUI実装のヒント
iOS側のUIの特徴と見比べるAndroid側でのUI実装のヒントiOS側のUIの特徴と見比べるAndroid側でのUI実装のヒント
iOS側のUIの特徴と見比べるAndroid側でのUI実装のヒント
 
SwiftとReactNativeで似たようなUIを作った際の記録
SwiftとReactNativeで似たようなUIを作った際の記録SwiftとReactNativeで似たようなUIを作った際の記録
SwiftとReactNativeで似たようなUIを作った際の記録
 
Fundamentals of Swift & Redux (ReduxとSwiftの組み合わせ)
Fundamentals of Swift & Redux (ReduxとSwiftの組み合わせ)Fundamentals of Swift & Redux (ReduxとSwiftの組み合わせ)
Fundamentals of Swift & Redux (ReduxとSwiftの組み合わせ)
 
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ(追加版)
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ(追加版)できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ(追加版)
できるだけUI系のライブラリを用いないアニメーションを盛り込んだサンプル実装まとめ(追加版)
 
iOSアプリ開発のためのSwiftビギナーズ勉強会 第6回 @Co-Edo
iOSアプリ開発のためのSwiftビギナーズ勉強会 第6回    @Co-EdoiOSアプリ開発のためのSwiftビギナーズ勉強会 第6回    @Co-Edo
iOSアプリ開発のためのSwiftビギナーズ勉強会 第6回 @Co-Edo
 
ReactNative + Redux + NativeBaseでつくるサンプル実装をのぞく
ReactNative + Redux + NativeBaseでつくるサンプル実装をのぞくReactNative + Redux + NativeBaseでつくるサンプル実装をのぞく
ReactNative + Redux + NativeBaseでつくるサンプル実装をのぞく
 
少しずつ手厚くして不具合や仕様漏れを防ぐために
少しずつ手厚くして不具合や仕様漏れを防ぐために少しずつ手厚くして不具合や仕様漏れを防ぐために
少しずつ手厚くして不具合や仕様漏れを防ぐために
 
まずはできるところから始める UnitTestとテストができる実装について
まずはできるところから始める UnitTestとテストができる実装についてまずはできるところから始める UnitTestとテストができる実装について
まずはできるところから始める UnitTestとテストができる実装について
 
Swift勉強会2
Swift勉強会2Swift勉強会2
Swift勉強会2
 

Similar to iOSアプリ開発で意識すると役立ちそうな「つなぎ目」の部分について

メディアアプリでよく見る無限スクロールするタブの動きへの考察
メディアアプリでよく見る無限スクロールするタブの動きへの考察メディアアプリでよく見る無限スクロールするタブの動きへの考察
メディアアプリでよく見る無限スクロールするタブの動きへの考察Fumiya Sakai
 
Hint of“Passcode Lock”Screen and Logic (with LocalAuthentication).
Hint of“Passcode Lock”Screen and Logic (with LocalAuthentication).Hint of“Passcode Lock”Screen and Logic (with LocalAuthentication).
Hint of“Passcode Lock”Screen and Logic (with LocalAuthentication).Fumiya Sakai
 
あのアプリの動きをUIKitのみでDIYしてみる(part2)
あのアプリの動きをUIKitのみでDIYしてみる(part2)あのアプリの動きをUIKitのみでDIYしてみる(part2)
あのアプリの動きをUIKitのみでDIYしてみる(part2)Fumiya Sakai
 
Potatotips3 hoshi gaki_akira_iwaya
Potatotips3 hoshi gaki_akira_iwayaPotatotips3 hoshi gaki_akira_iwaya
Potatotips3 hoshi gaki_akira_iwayaAkira Iwaya
 
Go言語で色々試行錯誤して フレームワークもどきを作ってみた話
Go言語で色々試行錯誤して フレームワークもどきを作ってみた話Go言語で色々試行錯誤して フレームワークもどきを作ってみた話
Go言語で色々試行錯誤して フレームワークもどきを作ってみた話Fumiya Sakai
 
Adobe DPSで電子書籍アプリを作ってApp Storeで販売しよう
Adobe DPSで電子書籍アプリを作ってApp Storeで販売しようAdobe DPSで電子書籍アプリを作ってApp Storeで販売しよう
Adobe DPSで電子書籍アプリを作ってApp Storeで販売しようTakashi Oonishi
 
デザイナーがXcodeを使って 開発効率をUPさせた 5つのエピソード + 現場エンジニアのコメント付き
デザイナーがXcodeを使って 開発効率をUPさせた 5つのエピソード  +  現場エンジニアのコメント付きデザイナーがXcodeを使って 開発効率をUPさせた 5つのエピソード  +  現場エンジニアのコメント付き
デザイナーがXcodeを使って 開発効率をUPさせた 5つのエピソード + 現場エンジニアのコメント付きMayumi Narisawa
 
20131005 cocoa関西
20131005 cocoa関西20131005 cocoa関西
20131005 cocoa関西Yosuke Uno
 
Uicollectionview
UicollectionviewUicollectionview
Uicollectionviewtowaki777
 
APIドキュメントの話 #sphinxjp
APIドキュメントの話 #sphinxjpAPIドキュメントの話 #sphinxjp
APIドキュメントの話 #sphinxjpTakeshi Komiya
 
使うっきゃない!iOS9で楽になったAuto Layout!
使うっきゃない!iOS9で楽になったAuto Layout!使うっきゃない!iOS9で楽になったAuto Layout!
使うっきゃない!iOS9で楽になったAuto Layout!SatoTakeshi
 
使うっきゃない!iOS9で楽になったAuto Layout!
使うっきゃない!iOS9で楽になったAuto Layout!使うっきゃない!iOS9で楽になったAuto Layout!
使うっきゃない!iOS9で楽になったAuto Layout!SatoTakeshi
 
サーバーレスWebアプリケーションを作ろう~AWSと比べてみる~
サーバーレスWebアプリケーションを作ろう~AWSと比べてみる~サーバーレスWebアプリケーションを作ろう~AWSと比べてみる~
サーバーレスWebアプリケーションを作ろう~AWSと比べてみる~拓将 平林
 
UIを作る際にライブラリにする? それともDIYする?の切り分け(僕の見解)
UIを作る際にライブラリにする? それともDIYする?の切り分け(僕の見解)UIを作る際にライブラリにする? それともDIYする?の切り分け(僕の見解)
UIを作る際にライブラリにする? それともDIYする?の切り分け(僕の見解)Fumiya Sakai
 

Similar to iOSアプリ開発で意識すると役立ちそうな「つなぎ目」の部分について (16)

メディアアプリでよく見る無限スクロールするタブの動きへの考察
メディアアプリでよく見る無限スクロールするタブの動きへの考察メディアアプリでよく見る無限スクロールするタブの動きへの考察
メディアアプリでよく見る無限スクロールするタブの動きへの考察
 
Hint of“Passcode Lock”Screen and Logic (with LocalAuthentication).
Hint of“Passcode Lock”Screen and Logic (with LocalAuthentication).Hint of“Passcode Lock”Screen and Logic (with LocalAuthentication).
Hint of“Passcode Lock”Screen and Logic (with LocalAuthentication).
 
あのアプリの動きをUIKitのみでDIYしてみる(part2)
あのアプリの動きをUIKitのみでDIYしてみる(part2)あのアプリの動きをUIKitのみでDIYしてみる(part2)
あのアプリの動きをUIKitのみでDIYしてみる(part2)
 
Potatotips3 hoshi gaki_akira_iwaya
Potatotips3 hoshi gaki_akira_iwayaPotatotips3 hoshi gaki_akira_iwaya
Potatotips3 hoshi gaki_akira_iwaya
 
Go言語で色々試行錯誤して フレームワークもどきを作ってみた話
Go言語で色々試行錯誤して フレームワークもどきを作ってみた話Go言語で色々試行錯誤して フレームワークもどきを作ってみた話
Go言語で色々試行錯誤して フレームワークもどきを作ってみた話
 
Adobe DPSで電子書籍アプリを作ってApp Storeで販売しよう
Adobe DPSで電子書籍アプリを作ってApp Storeで販売しようAdobe DPSで電子書籍アプリを作ってApp Storeで販売しよう
Adobe DPSで電子書籍アプリを作ってApp Storeで販売しよう
 
デザイナーがXcodeを使って 開発効率をUPさせた 5つのエピソード + 現場エンジニアのコメント付き
デザイナーがXcodeを使って 開発効率をUPさせた 5つのエピソード  +  現場エンジニアのコメント付きデザイナーがXcodeを使って 開発効率をUPさせた 5つのエピソード  +  現場エンジニアのコメント付き
デザイナーがXcodeを使って 開発効率をUPさせた 5つのエピソード + 現場エンジニアのコメント付き
 
20131005 cocoa関西
20131005 cocoa関西20131005 cocoa関西
20131005 cocoa関西
 
Uicollectionview
UicollectionviewUicollectionview
Uicollectionview
 
Flex入門
Flex入門Flex入門
Flex入門
 
APIドキュメントの話 #sphinxjp
APIドキュメントの話 #sphinxjpAPIドキュメントの話 #sphinxjp
APIドキュメントの話 #sphinxjp
 
使うっきゃない!iOS9で楽になったAuto Layout!
使うっきゃない!iOS9で楽になったAuto Layout!使うっきゃない!iOS9で楽になったAuto Layout!
使うっきゃない!iOS9で楽になったAuto Layout!
 
使うっきゃない!iOS9で楽になったAuto Layout!
使うっきゃない!iOS9で楽になったAuto Layout!使うっきゃない!iOS9で楽になったAuto Layout!
使うっきゃない!iOS9で楽になったAuto Layout!
 
OpenCV on mobile
OpenCV on mobileOpenCV on mobile
OpenCV on mobile
 
サーバーレスWebアプリケーションを作ろう~AWSと比べてみる~
サーバーレスWebアプリケーションを作ろう~AWSと比べてみる~サーバーレスWebアプリケーションを作ろう~AWSと比べてみる~
サーバーレスWebアプリケーションを作ろう~AWSと比べてみる~
 
UIを作る際にライブラリにする? それともDIYする?の切り分け(僕の見解)
UIを作る際にライブラリにする? それともDIYする?の切り分け(僕の見解)UIを作る際にライブラリにする? それともDIYする?の切り分け(僕の見解)
UIを作る際にライブラリにする? それともDIYする?の切り分け(僕の見解)
 

More from Fumiya Sakai

RxDataSourceをNSDiffableDataSourceへ置き換える際のTips集紹介
RxDataSourceをNSDiffableDataSourceへ置き換える際のTips集紹介RxDataSourceをNSDiffableDataSourceへ置き換える際のTips集紹介
RxDataSourceをNSDiffableDataSourceへ置き換える際のTips集紹介Fumiya Sakai
 
Measures for Growth with Firebase Remote Config & Unit Testing Using RxSwift
Measures for Growth with Firebase Remote Config & Unit Testing Using RxSwiftMeasures for Growth with Firebase Remote Config & Unit Testing Using RxSwift
Measures for Growth with Firebase Remote Config & Unit Testing Using RxSwiftFumiya Sakai
 
既存プロジェクトで使っていたDIをお引っ越し&DIYすることになった
既存プロジェクトで使っていたDIをお引っ越し&DIYすることになった既存プロジェクトで使っていたDIをお引っ越し&DIYすることになった
既存プロジェクトで使っていたDIをお引っ越し&DIYすることになったFumiya Sakai
 
UI実装に関するセッションを 簡単ながら振り返ってみる(仮)
UI実装に関するセッションを 簡単ながら振り返ってみる(仮)UI実装に関するセッションを 簡単ながら振り返ってみる(仮)
UI実装に関するセッションを 簡単ながら振り返ってみる(仮)Fumiya Sakai
 
UIKitやSwiftUIで表現や動きが特徴的なUI実装事例を考察する
UIKitやSwiftUIで表現や動きが特徴的なUI実装事例を考察するUIKitやSwiftUIで表現や動きが特徴的なUI実装事例を考察する
UIKitやSwiftUIで表現や動きが特徴的なUI実装事例を考察するFumiya Sakai
 
Hint of a little ingenuity about UI.
Hint of a little ingenuity about UI.Hint of a little ingenuity about UI.
Hint of a little ingenuity about UI.Fumiya Sakai
 
書籍執筆からの今後に向けてのロードマップ
書籍執筆からの今後に向けてのロードマップ書籍執筆からの今後に向けてのロードマップ
書籍執筆からの今後に向けてのロードマップFumiya Sakai
 
ReduxとSwiftの組み合わせ:改訂版
ReduxとSwiftの組み合わせ:改訂版ReduxとSwiftの組み合わせ:改訂版
ReduxとSwiftの組み合わせ:改訂版Fumiya Sakai
 

More from Fumiya Sakai (8)

RxDataSourceをNSDiffableDataSourceへ置き換える際のTips集紹介
RxDataSourceをNSDiffableDataSourceへ置き換える際のTips集紹介RxDataSourceをNSDiffableDataSourceへ置き換える際のTips集紹介
RxDataSourceをNSDiffableDataSourceへ置き換える際のTips集紹介
 
Measures for Growth with Firebase Remote Config & Unit Testing Using RxSwift
Measures for Growth with Firebase Remote Config & Unit Testing Using RxSwiftMeasures for Growth with Firebase Remote Config & Unit Testing Using RxSwift
Measures for Growth with Firebase Remote Config & Unit Testing Using RxSwift
 
既存プロジェクトで使っていたDIをお引っ越し&DIYすることになった
既存プロジェクトで使っていたDIをお引っ越し&DIYすることになった既存プロジェクトで使っていたDIをお引っ越し&DIYすることになった
既存プロジェクトで使っていたDIをお引っ越し&DIYすることになった
 
UI実装に関するセッションを 簡単ながら振り返ってみる(仮)
UI実装に関するセッションを 簡単ながら振り返ってみる(仮)UI実装に関するセッションを 簡単ながら振り返ってみる(仮)
UI実装に関するセッションを 簡単ながら振り返ってみる(仮)
 
UIKitやSwiftUIで表現や動きが特徴的なUI実装事例を考察する
UIKitやSwiftUIで表現や動きが特徴的なUI実装事例を考察するUIKitやSwiftUIで表現や動きが特徴的なUI実装事例を考察する
UIKitやSwiftUIで表現や動きが特徴的なUI実装事例を考察する
 
Hint of a little ingenuity about UI.
Hint of a little ingenuity about UI.Hint of a little ingenuity about UI.
Hint of a little ingenuity about UI.
 
書籍執筆からの今後に向けてのロードマップ
書籍執筆からの今後に向けてのロードマップ書籍執筆からの今後に向けてのロードマップ
書籍執筆からの今後に向けてのロードマップ
 
ReduxとSwiftの組み合わせ:改訂版
ReduxとSwiftの組み合わせ:改訂版ReduxとSwiftの組み合わせ:改訂版
ReduxとSwiftの組み合わせ:改訂版
 

Recently uploaded

IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)ssuser539845
 
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法ssuser370dd7
 
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見Shumpei Kishi
 
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~arts yokohama
 
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-LoopへTetsuya Nihonmatsu
 
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdfTaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdfMatsushita Laboratory
 
2024 01 Virtual_Counselor
2024 01 Virtual_Counselor 2024 01 Virtual_Counselor
2024 01 Virtual_Counselor arts yokohama
 
20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdfAyachika Kitazaki
 

Recently uploaded (11)

IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
IFIP IP3での資格制度を対象とする国際認定(IPSJ86全国大会シンポジウム)
 
2024 03 CTEA
2024 03 CTEA2024 03 CTEA
2024 03 CTEA
 
2024 04 minnanoito
2024 04 minnanoito2024 04 minnanoito
2024 04 minnanoito
 
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
情報処理学会86回全国大会_Generic OAMをDeep Learning技術によって実現するための課題と解決方法
 
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
持続可能なDrupal Meetupのコツ - Drupal Meetup Tokyoの知見
 
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
2024 02 Nihon-Tanken ~Towards a More Inclusive Japan~
 
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
「今からでも間に合う」GPTsによる 活用LT会 - 人とAIが協調するHumani-in-the-Loopへ
 
What is the world where you can make your own semiconductors?
What is the world where you can make your own semiconductors?What is the world where you can make your own semiconductors?
What is the world where you can make your own semiconductors?
 
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdfTaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
TaketoFujikawa_台本中の動作表現に基づくアニメーション原画システムの提案_SIGEC71.pdf
 
2024 01 Virtual_Counselor
2024 01 Virtual_Counselor 2024 01 Virtual_Counselor
2024 01 Virtual_Counselor
 
20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf20240326_IoTLT_vol109_kitazaki_v1___.pdf
20240326_IoTLT_vol109_kitazaki_v1___.pdf
 

iOSアプリ開発で意識すると役立ちそうな「つなぎ目」の部分について