シリーズ目次

検索の基本UIを知ろう

基本UIパターン

検索の基本UIを知ろう

2023

年

月

日

スキルを上げて、創造のための武器を手に入れよう

すべての動画閲覧には、メンバーシップ加入が必要です

メンバー登録について

■ Material Design - Search
https://material.io/design/navigation/search.html#usage‍

■ HIG - Search Bar
‍https://developer.apple.com/design/human-interface-guidelines/ios/bars/search-bars/‍

■ 店舗選択画面、参考UIのデータ
基本コンポーネント&参考UIリンク

‍

■ Material Design - Search
https://material.io/design/navigation/search.html#usage‍

■ HIG - Search Bar
‍https://developer.apple.com/design/human-interface-guidelines/ios/bars/search-bars/‍

■ 店舗選択画面、参考UIのデータ
基本コンポーネント&参考UIリンク

‍

UI PATTERN 入門

全

本

STEP-01

パターンを出す方法を知ろう

シリーズの進め方：UIのパターン作りを実践しながら学ぼう

2:53

シリーズの進め方：UIのパターン作りを実践しながら学ぼう

なぜパターンを出した方が良いのか

5:51

なぜパターンを出した方が良いのか

パターンの出し方

6:56

パターンの出し方

マテリアルデザインで基本パーツを知る

10:06

マテリアルデザインで基本パーツを知る

参考UIの調べ方

6:43

参考UIの調べ方

STEP-02

ホームUIをパターン作成でカイゼン

ホーム画面パターン作成ヘッダー

20:51

ホーム画面パターン作成ヘッダー

ホーム画面フィルター

13:06

ホーム画面フィルター

ホーム画面コンテンツ

22:08

ホーム画面コンテンツ

ホーム画面パターンからUIを作成

23:24

ホーム画面パターンからUIを作成

STEP-03

店舗選択UIをパターン作成でリデザイン

ダメな店舗選択UIをリデザインしよう

9:30

ダメな店舗選択UIをリデザインしよう

カイゼン要素を出そう

12:29

カイゼン要素を出そう

検索の基本UIを知ろう

9:09

検索の基本UIを知ろう

参考を元に検索UI作成

21:50

参考を元に検索UI作成

店舗選択部分をカイゼン

9:37

店舗選択部分をカイゼン

UIパターンを作成しよう

16:27

UIパターンを作成しよう

店舗選択のリストUI作成

10:41

店舗選択のリストUI作成

UIを統合、完成させる

16:07

UIを統合、完成させる

STEP-04

商品詳細・カート・確認UIをリデザイン

STEP4で作るものを確認

8:32

STEP4で作るものを確認

「商品詳細」画面の改善

11:50

「商品詳細」画面の改善

「カート導線」を改善

7:01

「カート導線」を改善

「カート」画面を改善

12:41

「カート」画面を改善

「確定/履歴」画面を改善

6:27

「確定/履歴」画面を改善

STEP-05

UI PATTERN まとめ

まとめ-Before/After比較

2:44

まとめ-Before/After比較

閉じる

0 Comments

Active Here: 0

My Profile Image

Logout Edit Profile

Be the first to leave a comment.

Load Previous

Someone is typing...

No Name

Set

4 years ago

Moderator

(Edited)

Delete Forever

This is the actual comment. It's can be long or short. And must contain only text information.

Your comment will appear once approved by a moderator.

2 Replies

Load Previous

No Name

Set

2 years ago

Moderator

(Edited)

Delete Forever

This is the actual comment. It's can be long or short. And must contain only text information.

Your reply will appear once approved by a moderator.

Thank you! Your submission has been received!

Oops! Something went wrong while submitting the form.

UI PATTERN 入門

パターンを出す方法を知ろう

シリーズの進め方：UIのパターン作りを実践しながら学ぼう

なぜパターンを出した方が良いのか

パターンの出し方

マテリアルデザインで基本パーツを知る

参考UIの調べ方

ホームUIをパターン作成でカイゼン

ホーム画面パターン作成 ヘッダー

ホーム画面 フィルター

ホーム画面 コンテンツ

ホーム画面 パターンからUIを作成

店舗選択UIをパターン作成でリデザイン

ダメな店舗選択UIをリデザインしよう

カイゼン要素を出そう

検索の基本UIを知ろう

参考を元に検索UI作成

店舗選択部分をカイゼン

UIパターンを作成しよう

店舗選択のリストUI作成

UIを統合、完成させる

商品詳細・カート・確認UIをリデザイン

STEP4で作るものを確認

「商品詳細」画面の改善

「カート導線」を改善

「カート」画面を改善

「確定/履歴」画面を改善

UI PATTERN まとめ

まとめ-Before/After比較

検索の基本UIを知ろう

UI PATTERN 入門

パターンを出す方法を知ろう

シリーズの進め方：UIのパターン作りを実践しながら学ぼう

なぜパターンを出した方が良いのか

パターンの出し方

マテリアルデザインで基本パーツを知る

参考UIの調べ方

ホームUIをパターン作成でカイゼン

ホーム画面パターン作成 ヘッダー

ホーム画面 フィルター

ホーム画面 コンテンツ

ホーム画面 パターンからUIを作成

店舗選択UIをパターン作成でリデザイン

ダメな店舗選択UIをリデザインしよう

カイゼン要素を出そう

検索の基本UIを知ろう

参考を元に検索UI作成

店舗選択部分をカイゼン

UIパターンを作成しよう

店舗選択のリストUI作成

UIを統合、完成させる

商品詳細・カート・確認UIをリデザイン

STEP4で作るものを確認

「商品詳細」画面の改善

「カート導線」を改善

「カート」画面を改善

「確定/履歴」画面を改善

UI PATTERN まとめ

まとめ-Before/After比較

0 Comments

ホーム画面パターン作成ヘッダー

ホーム画面フィルター

ホーム画面コンテンツ

ホーム画面パターンからUIを作成

ホーム画面パターン作成ヘッダー

ホーム画面フィルター

ホーム画面コンテンツ

ホーム画面パターンからUIを作成