2022-05

TwitchのUIデザインをコンポーネント・パターン・フローごとにまとめています。webデザイン、アプリデザインの参考に活用ください。

写真 / ビデオ

Fortnite、PUBG、雑談TVを視聴しよう

Twitch

オンボーディング

9cd5de87-ce29-4ab6-9ef3-5db2dd895e78.png

00abf635-0407-4e1f-b2df-4719151fdae8.png

0dd6343a-5a20-4406-b11b-863760b463ff.png

f352b440-6496-40c1-ab59-6e02ecd470be.png

a2767462-58f2-4125-a2bf-e771f88142f3.png

4b0ad02a-02fd-4ae8-82f0-8780d6d687d7.png

ba645c97-32e7-45eb-87d6-ccd110fce87c.png

8326a1ee-0b26-4805-90da-2f5c29a9af0c.png

92034f62-5f13-4790-93fa-5f9e93642c7e.png

064fdc6d-8af3-45a1-81fc-3cfc932ee2a3.png

6ebc9620-9484-44c7-ad6a-80fa6e06e77c.png

fb0afc2f-ab35-4808-ae6b-f76134cace09.png

f67c33f6-be00-4821-bbb4-bcd915ec1766.png

41b1ca6a-7d56-4b6e-a801-5ca380ad7121.png

bc92df6e-f419-4b4d-9499-9f108b738b55.png

ed112bd7-0236-4c8c-b391-6f0832a50223.png

d267ed7e-5520-4866-b4ed-b323dbe1806d.png

発見

0ec18990-1a8b-4500-9f9b-901324bd19fa.png

e7d5f6b1-6858-454b-b594-f966976b80a3.png

eb200f77-07dd-4d3c-be24-3adbb395efe0.png

bf6051f2-7afe-4ffa-903d-31b483767e2a.png

7a2f934a-6609-4078-ad09-a401422b6ccf.png

605a3a3f-5dac-4a77-96fe-a150d3e7d3e7.png

ゲーム

f47e854a-8961-4cf9-9eb0-5273b811388c.png

74c6549a-29c4-433c-849d-f7bd968c3338.png

5330b2f2-b9ab-425c-ab9b-5033ba9f340b.png

79aca139-26b5-4b62-871b-79570fb486ac.png

1e7abb15-721a-4bd0-81b6-0f042202f152.png

a0a3947a-11fc-44ed-b147-599540ece862.png

dcc31140-b330-46b4-954c-fc7bdc65e97a.png

597fa260-08ef-43d0-90a3-aa9735729ea7.png

48ba29f5-e36a-4643-ae43-c22ee0cf98df.png

b69e05e1-c0fb-45c2-946f-09b2d4a6307d.png

3bb2d243-933e-4bdf-9238-db3d533ab53c.png

f7d5f22a-dd4d-4d5e-ba7f-5d2d09259fc6.png

5dd2f0ea-93f1-4b12-a3a9-b38ae3c2cf63.png

fcfba8cc-2f23-4f09-bcb1-09c4cea02314.png

Esports

11689392-3350-4bfc-bc4d-6ea171f4d8e0.png

26b85587-4c5b-4ab5-97be-174ccbd3e885.png

bef199de-35dd-4276-9bf4-de368efb736d.png

b58f6bc4-bad4-496f-92c7-de4bcf9fc9f5.png

feefb5c0-efbb-484a-a196-6141733c4b02.png

32935e19-afe4-4b47-923a-4cb543748f20.png

a1e64125-5ad1-42ea-93eb-8b2abb14589b.png

5c517c70-ba73-45c8-831c-3673ebf02620.png

5d2ad3b8-9569-48c8-ab10-879e909126be.png

Music

0a774828-b3d1-4dbc-9ab1-274feea471ab.png

2426ccc7-7292-4d16-bb39-e2bf3cbcdf80.png

a0961e1f-f997-44d7-98fd-9a7e665a3d6f.png

d3b6d968-3c6f-43b2-a5fe-3e8b71aa1662.png

f4df4bd2-386f-44d7-8e4c-3321e86b1dd7.png

9461228d-f6a6-4d7d-a9a4-039217a44c25.png

772e1e99-8b8d-4185-bf13-2f0ae4569d84.png

6e2558cc-d4be-47ef-8c78-6168dc3dfbb5.png

3e924947-9db5-4da7-9031-e366a05a8247.png

f5ca73da-1ba5-4019-8c73-a30363782709.png

25d6f3d3-1470-445b-913e-f514b9204c39.png

雑談

ca5a82e3-6a79-4612-bd10-44b34f0f5db3.png

5dd98693-5ba3-471d-9772-3af2ae69a163.png

fd09ab3d-be82-4ff9-8153-37073a014bd3.png

22ac10dc-182e-4c8c-a787-c659096764f4.png

803cbffd-2bd6-4f49-8441-10081f7e4ad1.png

1cc31b84-bf74-434b-b19b-b012fc688e69.png

2d7b9edb-2039-4104-aa94-6023039d2bdb.png

46cd9e82-ac84-4ef5-953f-75e6a5ca3de7.png

0ae49a64-6b57-40c9-a5ba-248d401430aa.png

動画詳細

aab29b10-043c-4dab-8dcc-8bbd2a8f35fc.png

5e276c7d-27a3-4b42-9b08-33772cc51979.png

f32b888b-c95f-41c9-9569-cbbca5e8ef11.png

c9713c62-93d7-4bf3-9f64-59e2f8672cde.png

36fada3b-44ba-4ccd-a568-a026bae9a34a.png

75c69350-4421-4a5a-89e1-392354d4d285.png

eb7251d5-9dfa-468b-badd-32ac6e3b3690.png

6cf0d7f6-a65c-4054-9db8-dec6ccecef72.png

76752592-50aa-45a6-a52f-845f8e3b4fbe.png

19517fb5-b3a2-4603-af6f-a3a50909be29.png

5ccd8cab-98ee-4a95-93a0-eba2ff21f4ff.png

e8004c62-b394-4b6f-9233-12a9c1993963.png

eca6bb1a-0180-4aa3-8395-d8790b135a64.png

3f0e8083-796c-43b2-b5a6-23344685aa8d.png

928f989b-eeba-4bed-a02c-591633f1eb1e.png

63936819-b369-4dc0-9b20-c0379304d926.png

b789c10d-61b4-458e-a9f3-23390bc66e5b.png

e6e2c0d8-62f7-4ba6-ab13-76d64bfc1ad4.png

a178e648-88bd-4d6f-9390-a0be93478f7e.png

17e04f9b-dc06-487b-99ed-ba35d96f059d.png

216cfc62-2b01-4b4c-85d2-cc05b348d402.png

58cd26af-20ab-4ef5-9898-45cea05343b3.png

dce06763-e1f9-4888-9143-2695f4bc08f5.png

bc367a75-7cdd-409f-991c-3cb0f7e0bb4d.png

f234f6c4-7e8a-4cd7-9efd-d869a7e63c6b.png

85ffdd84-0848-4dbd-ac31-dc30f9ec86b1.png

b1c81013-fd2b-483c-9e99-7dc2cec1c72b.png

bbfc9a6c-fe32-49e4-8aa6-9912fd1ee276.png

2dfbcf85-c94a-4af3-a683-db4f0e051816.png

フォロー中

7a0ed7d0-1b26-4fca-b19e-10fb0c292fab.png

2caf3e3b-8411-4a11-b23e-43f3ca0ed446.png

52d2d349-2a31-4397-88aa-fee4a7b17e92.png

d451e254-4589-410c-89af-3b1e1228b2f3.png

f12cc69f-2400-4907-a704-8d76a8e3341d.png

b97dea5f-df6e-4263-aa6e-c2b587926f9e.png

71c8fc22-d438-404c-b9ea-297aa540c215.png

配信

deeffae6-90b3-4393-8797-c317d265daaf.png

69f29857-b97b-4ac8-b944-58e0f28174e1.png

ba14f17f-79a5-41dc-8dec-f56d6473367d.png

e4e1eee0-ea86-4e39-8bca-87f5963c0350.png

5cf20cb4-4c8d-44dc-bab6-13579e5c6c07.png

bf8d4d99-a0b3-488c-903d-1165e564b9c9.png

08a3d5f9-e1be-4b74-b3b7-e6b3bb03ee0a.png

e64affe8-9633-4df6-9cb1-80f503bf0b80.png

171c8cb0-5c31-49c7-9823-7b18f5bc1873.png

4b436968-b639-4961-b79d-64f5030434ea.png

b5b29c55-67a2-454e-aa8f-96ad810eeb32.png

5f88da4d-8715-485d-95e0-c4dc33b1c34d.png

77214e66-5bfd-4bf9-a87d-3f852b8b168d.png

dcabcab3-5669-4abf-aaa8-fb3489577718.png

04f97a72-5b3f-4684-a985-a2e4ca5d6f55.png

1db12657-de23-4676-9ba9-2934f147a193.png

1e98692f-6730-4001-b600-90f4db4f84f6.png

091e2a9e-ecfa-4bba-902a-869222019e41.png

プロフィール

476702c6-ee60-4857-bdf8-fc8d17d2fb6b.png

d1e7ef52-3cbb-4700-a8c5-67c15fdb144c.png

120060cf-9593-4356-a192-9b8ee2c43a09.png

ac902561-1676-4b63-9be0-5de29ea02d70.png

5e0fbf64-100b-42d4-9c47-24e95ec920a8.png

f10c9da1-b6fd-4f2e-9496-a2b181b9f932.png

bd0fd881-6b6b-4677-8103-395c8642f480.png

e5437eb2-2a14-486d-917e-9e20c9211625.png

517dc4eb-0642-43cf-81e0-0f16b48fac5d.png

494a389c-411d-4a4f-af40-efab7b351a12.png

2cc2727f-e5fe-4a52-9607-fdd4c2bc1a9b.png

4b0ee2b0-8120-44a4-963e-1e4972dfad59.png

fdbd577c-d1a4-4da6-ae27-a8bf1151999e.png

3c784de7-9138-46ce-91dd-ad8c3b1a26aa.png

6211fdbb-16be-4d01-823f-9fd881014bd2.png

19e81ce3-66d0-40fd-9f5f-eca898b9c9a2.png

9e66efa8-be5b-4171-bd3c-d445be2c13a8.png

db8f0b0a-a57e-429b-ac47-e600b2bbf3e0.png

アカウント・その他

1bee0089-e884-4cd7-8814-6e6f82be42a7.png

66bc2aba-2d36-4384-b43f-8c8ab24e68c9.png

82b5b360-d128-4bc6-b805-ab76b3063472.png

9cc40fd2-6efe-422b-8293-c3f8b5b0f6f6.png

3dd6ed96-4c25-4aa1-8555-3746d14e9a14.png

34c8b4b4-a2a3-41db-9877-9d56380ab4f1.png

55755d23-5805-460c-acd8-64ecf31707a0.png

e8298d23-3f6a-4237-a637-ca14dbe881f1.png

27845b50-cff1-4af6-b567-6eeb58a2c1e3.png

92d4948c-afcf-466a-a9cb-7b400061c317.png

d93e5bd8-9e75-4e25-8be7-1d1876f86140.png

7d9be5ed-22ef-4b4c-ab44-4efeac96d478.png

295bc628-a8bd-45f2-a847-25e2c72a1e17.png

5d1a528f-215c-43c7-b425-5aca70335b2a.png

7b1428ba-ec81-44c9-a578-a8b50d543fe3.png

62dfdced-3c50-4efd-b340-f2a6c2384ddc.png

afc0f986-44ac-476a-aba9-53740c6d381a.png

9d897d64-de32-4e9b-99c0-3d34e28fa95c.png

062a7b5e-3c5a-4e9b-b86b-15d43ff80060.png

8a36b14b-1e0e-4b96-aabb-f413bd0f33e9.png

d119cddb-583c-4255-9fa7-30cf71718406.png

「Twitch」のUIデザイン一覧（2022年5月版）

Twitch

オンボーディング

発見

関連アプリ