2022-07

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

JR東日本アプリ

オンボーディング

d31f243f-4cd7-437e-9c26-a9323e3a485d.png

95fb1ce0-0a22-4056-bbf5-1d293a4209f2.png

2a42b0ed-1231-45e5-a47d-60a5385c30eb.png

a3fd3f17-6e5e-4e02-b590-7f707cc064f3.png

5fcec718-f306-4692-9a72-e123f37e333a.png

c757d733-2f0a-4c35-9925-58581281d010.png

経路検索

c18341ad-9a9c-46ed-8634-74292e91323a.png

58754e21-f2da-42ec-a9d1-8150749c8499.png

369dab21-23ba-427a-9eb0-fd553189a2db.png

50cf700e-de9c-4d0e-8032-3456e629a9a2.png

b941c0ad-b938-4641-a70e-2761bcb9a0f4.png

fa5822cc-08ca-45b0-ad00-eda64138e177.png

4129777a-3861-4628-acff-455799abeb98.png

35bb13a4-ec4b-48b3-8f74-cb230156aaa9.png

b2193002-077f-49f0-943e-bea6110d32fb.png

c12e124e-966f-4aa9-a431-61d79f80fcb3.png

331d33b2-d76a-4c17-adc8-1de49c919d26.png

検索結果一覧

53f533b7-a83f-42bd-9bd9-49d125057048.png

229840a3-53cd-4268-858b-0e7976a98240.png

b018336f-368e-483e-8acb-df11fdc25afa.png

0b7a084d-8acd-4f5e-9943-d30f642b4928.png

1bbb7d7e-069d-4ee8-ba12-81e039611de5.png

7afe7f84-0ad9-4668-99be-0d50991fc9a3.png

5f45edc5-62c9-499f-9e7d-c767138c8caf.png

fc52882f-1a29-439a-80bf-b33eb20b7a0b.png

ebf3c9e2-3906-4694-b4b5-27e960e78f0a.png

8d2c7d80-cd87-4f87-9447-ec054f6eb904.png

検索結果詳細

8be6deb6-38f0-43ec-b7e3-987ab9a509d1.png

3dcca33b-2222-447d-b05d-fbfcf08338e0.png

8efcc823-6f5c-48c8-9545-cfc6c01b37a3.png

6b3b7bf9-3bad-44b8-ab6c-c342efb87ee1.png

f78d32b1-2b05-405f-aaa7-e6d49774e2c6.png

1e963373-8bbc-4e12-b30f-6c3a21dc5ebe.png

60d986aa-9fd1-4f8f-b8b9-66da4164441b.png

8f3c941d-c25f-47f3-8c2b-7a5f8bc916b7.png

16a60d19-77a7-4fe2-bdbc-560448344540.png

4f025329-09a2-42b2-8cce-1b6b1d3859ca.png

af13fb27-dbe6-468e-8ae6-2f1590ed5191.png

11cea0f3-6a12-4ae0-8db0-63a6b6d60458.png

873082bb-7f0a-445a-a1e3-df04fdbd60a0.png

d2aca60e-da2d-473b-9e57-bbc4689768b6.png

dbe0d797-88fa-4e87-9c77-003b2c8b0d60.png

95d16f18-d38c-4fd1-93cf-85de250428a4.png

09d9ee4a-945b-443a-b86c-7f82299f3aa2.png

3183d6b7-3ed3-4e3c-a4dd-5112c6b06f4e.png

d7496437-1737-4973-9152-be1904e6544a.png

e4bbb413-4999-412b-905b-e7eba26698bf.png

3b3a00ed-5b19-4adf-8e72-a86fdd2cedb3.png

c84fc2b4-972d-448e-8009-7b786ed481fd.png

4c410eef-3478-4127-9383-97a84546b75f.png

04506831-175f-46c0-bd5c-68a38fdf26ee.png

6e57b235-b7c1-4f67-9a88-12db35aea772.png

b8cb2768-cc5b-4567-9081-6e5e089c0683.png

473433f6-2ff2-4eac-934b-d80612650a80.png

dfe1982f-4698-4f41-b6ac-169651833438.png

78f90269-4ed5-45b3-8f6c-b24dcd5290de.png

運行状況

1ae3d6e2-1b97-4300-b029-a29727d65742.png

ebeedcd9-3654-4930-be53-e8f78dcf56fb.png

9581951d-6a26-4c9b-bab6-cd133006760e.png

9ed381ca-75a2-4633-adc5-a8275eace00e.png

374380bb-a62e-42ba-baa2-cb371a01f92b.png

d470e689-420f-439e-aada-f0cbc62af624.png

6a09a49f-c6ae-4065-8f65-41b3f9f67279.png

65c458a1-45d5-4d55-b15f-35f9c2354699.png

9986c190-517a-4c47-96b6-7d8b374ce4f0.png

cbae4618-9ac3-4003-92d0-bb41103d4790.png

bde94d59-8523-4cc3-a4a8-b16380d5060e.png

ba771b4f-4ef8-455a-879e-2d28aa378845.png

62be4bb9-220e-445c-b5c0-f55f89fab323.png

60013294-1c87-4417-a9ab-ac287bf6fa61.png

c268f548-dcca-4559-8000-a095b951332b.png

d2e9c854-c06e-4594-aae6-569d7ea5d8cf.png

e6b87c1f-e369-4be1-9cd0-1b0ca836d54e.png

00cafcda-08b6-4085-ab5b-4719a8103a8b.png

9606978e-10d4-49a3-a264-f10fb8c3badd.png

6518ec16-90c7-4e96-b932-441e97ef0c4d.png

a183bd50-c5cf-4c04-91c3-892376a9c132.png

68a8eeac-2b88-4f50-93fe-73aa6954d49b.png

2947c368-06f7-4966-8496-070d988db723.png

5b1614a5-76e8-4914-9597-3c0257355f58.png

b82893f6-5f9e-495d-a0ad-ddf05b8af845.png

3ec3151a-8b32-4776-b407-8e7c3904a16c.png

526a6077-3505-447a-a187-4082ff7beccb.png

7977bb0b-201f-4aa6-bf51-0ace58c84ad0.png

22a1723b-e4a4-4ff3-9271-7cb47d7bb351.png

b19a5929-50fa-4e8b-aeb4-b4a6be98f2ce.png

8a233592-a2a9-4cfa-a9d7-f2f070c93192.png

b938e7da-8182-4a02-8793-5be4ce9ad9d2.png

6fdf471b-2f5d-4667-8000-a180f74ba003.png

b2fb3bdd-aeee-46c2-a5c8-d8bdaa8eee12.png

0bc40634-e9b4-497f-874b-fae56fc7cf0a.png

f51e9d22-354b-4bdd-90b9-2250d5c2c861.png

a4767992-8f97-4d3a-8b83-bd46fb12a157.png

9c438037-a779-43b7-bed1-384317c9bf75.png

88299550-6a89-426a-9b7d-0d78ff55747d.png

駅情報

c8a94acc-5ed4-420a-a9d6-cf01513b9a5f.png

708146d7-1f13-401c-a865-ec8b5f3c6b05.png

80698737-8782-4d43-ab09-683bc235f150.png

f375257c-b063-43ea-ad38-cbc021eae840.png

45d7c072-cd63-44d8-a565-2c618c9e09ee.png

89a1f067-a08a-4a22-9407-24c31f76d21e.png

fe127e5c-b011-4501-8a05-00685dbbb52f.png

4067fe1d-6d7e-4f6c-891c-2d6ab12b322a.png

954ecde7-1f87-467e-aaa5-56c6f6769f99.png

aec7501f-4889-4ca1-afff-8d9b01b62cf8.png

f44c7d40-ce83-4c7d-b8ea-db4d3d464d60.png

609df339-f70e-4662-9237-daa3716aae70.png

b530dec9-d8fb-4a45-b8f6-38bb251d9b38.png

aca29485-d1ca-4328-8eb6-f3f6371361e4.png

34140be9-3552-46ba-a6ef-c87f957db748.png

2ff6a950-fccd-4758-9b77-5017009d86bb.png

ca00587a-0eb8-4849-9ae4-7df33fd134c0.png

80636ba5-43d5-4754-81a7-e81b6a9b3eeb.png

a8c935aa-9503-4cd5-ad02-4ab66329a235.png

e971e228-7215-4713-92ab-c41d38c001ad.png

5058635a-394e-4618-acbe-3af3c6093037.png

52da9eba-c747-42d2-90be-bac8763feca6.png

e867ec9a-fd16-4db4-aefb-7b89a018edb3.png

30ae2d07-58ce-44cc-9fe8-3bba0d80f43e.png

8b34c817-f2c4-4e6f-aaca-8709337ddce8.png

fd91c988-09cc-47ed-b689-6c8bd42da33b.png

3ec0fbb1-b595-49a9-9380-38931689a45e.png

9427c7e0-5ce2-4b04-86fa-39b6dc4ca41a.png

07fa198b-fd08-462f-ac23-261a264bd520.png

41876389-6691-4d9a-a8bd-aeee3a495175.png

cc90b067-a277-4e70-beb3-561645feb415.png

d5fe3624-a8be-4d99-9493-66c13f956d28.png

4551bf28-63f0-4ab2-83be-0a2657d07a0c.png

e3f0a276-c6e0-46b4-8fe1-e648244b5143.png

581c0f4f-de60-4f50-9eff-c5edaa30eacf.png

04ef353a-d804-486a-8dbf-91507dde0d6d.png

c7b478a0-e78d-4d81-829e-12961fef7f33.png

7e124cbc-a6e1-4c48-9e4e-af1e794bb791.png

99327419-804a-4ead-9d64-dd4e17817938.png

cf707654-77c9-4795-a2e6-9f492afddc9f.png

87facd65-5369-4550-9e38-a07e5e4e40b2.png

5fb67b76-453f-435c-9b00-1e701e515af3.png

d4929d8e-4124-4a08-ad82-5d5ebdc356fd.png

4ead4623-dc94-4bee-864e-cc8a9bcab71c.png

16642e1a-e9ec-4d7a-a55c-eda96c3f5d28.png

f3c31024-9c37-4877-a36f-70da59315585.png

4847081a-27f9-456d-8322-29a1f9cd95d9.png

727aee8f-3854-478c-aa6c-501c86fbeced.png

356fe937-03c6-4510-93e9-249e40ad17e8.png

cff4d273-419b-492a-ad89-88bb162e8bc3.png

30022b5a-05bd-4941-8123-14f0d03a9f50.png

e151efdd-c9ab-4b28-8dcc-6e8813317774.png

f22865a1-7ac0-4476-bc01-36d28b1a16e5.png

e9698646-865c-4afa-a103-66e78c3e6aa5.png

16a03bd8-55d8-4c3f-a8ba-66f1f46912f8.png

「JR東日本アプリ」のUIデザイン一覧（2022年7月版）

JR東日本アプリ

オンボーディング

経路検索

関連アプリ