Flows
Awareness
Components
Last update
Jul 23, 2022 6:53 PM
_08.04.40_a._m..png&w=3840&q=90)
397. Modal with Card Options
394. Page Outline Floating Scroller
393. Colored Checkboxes
392. SaaS for Construction Workers
390. Icon Software Landing Page
389. Text Edit Inline Input
388. Multiple Item Selection Drag & Drop
386. Skeleton Loader
383. Video Animation on Touch
382. Interactive Background Animation
379. Dropdown Filters
378. Modal Blackout with Animation
363. Better History - Back to Top on scroll
361. WhatsApp - Progress Bar Loading
357. Google/Youtube Help - Fixed Form with Steps
357. Google/Youtube Help - Fixed Form with Steps
355. Jira - Feature Presentation Tooltip
355. Jira - Feature Presentation Tooltip
354. Figma - Floating Form with Steps
354. Figma - Floating Form with Steps
353. Population Pyramid - Visualizations with live filters
362. Modal Blackout with Form & Animations
349. HubSpot - Toggle High Contrast
359. Toggle List/Grid View 
347. YouTube - Floating Progress Bar
357. Modal with Steps (No blackout)
344. MercadoLibre - Horizontal Item Slider
343. Behance - Login with Code Validation 
342. Savee - Light/Dark Mode Switcher 
340. Asana - Zoom/Magnifier Over Image
341. Savee - Image Grid Customization
339. Asana - Platform Onboarding Simulator
345. Vertical Accordion for FAQs
336. Floating Popover on Click
336. Floating Popover on Click
343. Modal Drag & Drop to Fixed Position
334. MercadoLibre - Call to Action Trigger Effect
332. Apple - Drag&Drop Browser File to Desktop
331. Linkedin - Search Bar Blackout
330. PositivePsychology - Article User Feedback
328. Apple Safari - Zoom In/Out Transition
333. Static Tooltip with Steps
333. Static Tooltip with Steps
325. Apple - Drag & Drop Slots
324. Visual Studio Code - Dual View Scroll Sync
329. Postman - Onboarding Tooltips
329. Postman - Onboarding Tooltips
321. Caloriemama - App Hero Swiper
320. Discord - Sign In with Loading Tips
319. Wordpress - Delete Confirmation with Name
318. Binance - Tooltip on Features
318. Binance - Tooltip on Features
317. Zoom In—Out Transition on Click
316. Apple - Tooltip on icon
315. Signal - PIN Reminder
314. Snapchat - Snap Camera
312. Pocket - View Switcher
310. HubSpot - Checkbox Confirmation
309. Instagram - Brand Gradient
308. MercadoLibre - Hero Slider
313. Modal Blackout with Scroll
312. Google Data Studio
305. Notion - App Download Page
309. Horizontal Slider for Styles
308. Spinners for Module Loading
307. Tooltip on Hover
306. Drag & Drop for Reordering Items
303. Background Animation
302. Theme Switcher in Side-drawer
300. Sound Bars Graph
299. Fixed Corner Popup with Steps
299. Fixed Corner Popup with Steps
298. Avatar Sync with NFT
297. Thumbs Up/Down
294. Full-Screen Steps Animated Transition 
289. Floating Popover on Click
288. Vimeo - Topbar Language Switching
286. Apple - Background Animation on Scroll
284. Emergency Information Map
284. Top Tooltip on Link Hover
284. Top Tooltip on Link Hover
282. Telegram - Chat Setup Wizard
281. Ideabot - Background Animation on Mouse Movement
280. Slack - Workspace Creation Wizard
277. Horizontal Card Slider with Actions
268. GIPHY - Alert on Drag & Drop
275. Popover on Hover_07.10.33_p._m..png&w=1920&q=90)
_07.10.33_p._m..png&w=1920&q=90)
274. Interactive Background Animation
264. Figma - Interactive Background Animation
264. Figma - Interactive Background Animation
268. Modal Blackout with Swiper
267. Google - Horizontal Card Slider
259. Apple - Drag & Drop List Items
262. Fixed Modal Blackout 
257. Spotify - Zoom In Transition
258. Squarespace - Adaptable Viewport Size
256. Modal Blackout with Steps & Forms
243. GIPHY - Trim Video Slicers
253. Youtube - Table Row Selector
240. Instagram - Horizontal Accordion
251. Progressive Layout Loader
238. WhatsApp - Color Switcher Preview
237. Apple - Snackbar Popup Animation
235. Background Animation on Hover
233. Asana - Floating Animation
241. Modal Blackout with Steps
231. Automatic Floating Popover with Steps
228. Notification Bell Status
236. Horizontal Graph with Time Ranges
226. Youtube Studio - Image Multi-zone Crop 
225. Cloudflare - Multiple Graphs by Time Ranges
232. Drag & Drop to Browser
223. Apple - Stop Operation Progress
222. Cloudflare - Toggle Light/Dark Theme
221. Apple - Image Grid Spacing
220. Apple - Multi-window App
218. Apple Keynote - Template Format Selection
217. Apple - Cropping multiple screens
214. Netflix - Information Toggle
218. Modal Blackout with Steps, Forms and Animations
212. Automatic Background Animation 
45. Webapp Video Loader_11.42.04_p._m..png&w=1920&q=90)
_11.42.04_p._m..png&w=1920&q=90)
165. Two-step Download Flow
59. Ecommerce App Homepage (5)
183. Apple MacOS - Full Screen Widget Customization
162. Login Value Compare
101. Downloading Desktop App_11.28.04_a._m..png&w=1920&q=90)
_11.28.04_a._m..png&w=1920&q=90)
169. Youtube Studio - Delete Content Forever
172. PedidosYa - Search Results Recommendation_00.32.31/w=1920,quality=90,fit=scale-down)
52. Uber EATS - Making a Food Order
31. Page Blocker Edition Warning_09.47.02_p._m..png&w=1920&q=90)
_09.47.02_p._m..png&w=1920&q=90)
53. Apple Safari - Editing Bookmarks
95. Delete Confirmation with Name_02.02.36_p._m..png&w=1920&q=90)
_02.02.36_p._m..png&w=1920&q=90)
175. Tab Preview on Hover State
175. Tab Preview on Hover State
161. Apple - Two-Factor Validation (2FA)_13.07.18/w=1920,quality=90,fit=scale-down)
91. Settings for Account Privacy_12.08.18_a._m..png&w=1920&q=90)
_12.08.18_a._m..png&w=1920&q=90)
138. Read Modes_03.46.23_p._m..png&w=1920&q=90)
_03.46.23_p._m..png&w=1920&q=90)
148. Search Bar Fade-out_18.38.50/w=1920,quality=90,fit=scale-down)
134. Save for Reading Later_12.09.49_p._m..png&w=1920&q=90)
_12.09.49_p._m..png&w=1920&q=90)
43. File Upload Status_13.52.38/w=1920,quality=90,fit=scale-down)
54. Apple Safari - Browser Reader Mode_02.31.50_p._m..png&w=1920&q=90)
_02.31.50_p._m..png&w=1920&q=90)
201. Modal Blackout with Actions
189. Illustration (Meme) on Empty State_10.03.52/w=1920,quality=90,fit=scale-down)
130. Animated Email Page
114. News Swiper_09.27.02_p._m..png&w=1920&q=90)
_09.27.02_p._m..png&w=1920&q=90)
144. Meeting Guest Warning_15.24.08/w=1920,quality=90,fit=scale-down)
137. Product Color Selector
132. Amazon - Store Tooltip Reminders
132. Amazon - Store Tooltip Reminders
181. Plan Upgrade Flow
111. Magazine Subscription
7. sitepoint - Accessibility Adjustments
163. Open App from Web
191. Viedo Rewind & Forward
157. Webflow - Magnifying Glass on Images
65. PedidosYa - Location Confirmation
198. Take action on Music Claims
89. Bottom Page Fake-News Warning_02.23.00_p._m..png&w=1920&q=90)
_02.23.00_p._m..png&w=1920&q=90)
61. Section Dropdown_11.40.00_a._m..png&w=1920&q=90)
_11.40.00_a._m..png&w=1920&q=90)
11. Apple MacOS - Split OS Screens
70. Trip Starting Point
62. Google Maps - Weekly Schedule
127. Google Maps - Notifications Disabled Warning
179. Stylized Feature Highlighting
203. Password Expiration on Login_23.24.56/w=1920,quality=90,fit=scale-down)
56. Automatic Blackout Popover with Steps
158. Bar Reading Status
115. Buffer - Hover Instructions_01.10.02_p._m..png&w=1920&q=90)
_01.10.02_p._m..png&w=1920&q=90)
81. MercadoLibre - Saving Favourites as Guest_11.47.50_a._m..png&w=1920&q=90)
_11.47.50_a._m..png&w=1920&q=90)
51. Download App Reminder
167. Apple MacOS - 2-pane Widget Customization
139. Synced Hover Animations
193. Apple iOS - Contextual Feature Presentation
73. App Swiper
152. File Icon Selector
145. Communication Preferences on Sign Up Flow_22.41.58/w=1920,quality=90,fit=scale-down)
145. Suscription Options_16.25.05/w=1920,quality=90,fit=scale-down)
147. Linked Settings for User Permissions_09.35.30_p._m..png&w=1920&q=90)
_09.35.30_p._m..png&w=1920&q=90)
148. Half-page Illustration Slider_17.34.19/w=1920,quality=90,fit=scale-down)
29. About.me - Wizard Generation Profile_01.47.59_p._m..png&w=1920&q=90)
_01.47.59_p._m..png&w=1920&q=90)
36. Contact Segmentation_04.18.47_p._m..png&w=1920&q=90)
_04.18.47_p._m..png&w=1920&q=90)
87. Warning on Product Homepage_12.12.08_a._m..png&w=1920&q=90)
_12.12.08_a._m..png&w=1920&q=90)
10. Background Ads_07.31.59_p._m..png&w=1920&q=90)
_07.31.59_p._m..png&w=1920&q=90)
100. Automatic Floating Popover_23.29.09/w=1920,quality=90,fit=scale-down)
174. User Input for Image ALT Text
182. Static Tooltip for Text Formatting
124. Critical Changes Warning_11.56.38_a._m..png&w=1920&q=90)
_11.56.38_a._m..png&w=1920&q=90)
107. Updating Phone Number Flow
192. Modal with Actions
125. Product Highlights_01.16.07_p._m..png&w=1920&q=90)
_01.16.07_p._m..png&w=1920&q=90)
103. Subscription Reminder
133. Card Slider with Call-to-Action
131. Free Audiobook Trial_12.02.51_p._m..png&w=1920&q=90)
_12.02.51_p._m..png&w=1920&q=90)
8. Adobe - In-App NPS Survey
49. Notification for Order Review
116. 2-pane Automatic Slider
28. Slack - Find your Workspace
15. Notifications on Map Geolocation
14. App Bottom Popup_01.38.38_a._m..png&w=1920&q=90)
_01.38.38_a._m..png&w=1920&q=90)
122. Automatic Popover with Steps
32. Mailchimp - Makes me feel
40. App Image Loader Skeleton
96. Encouraging Allowing Ads_06.06.59_p._m..png&w=1920&q=90)
_06.06.59_p._m..png&w=1920&q=90)
171. Slack - Multi-browser Sign In
186. Apple Safari - Browser Background Customization_15.51.37/w=1920,quality=90,fit=scale-down)
116. User Feedback on Web Content_00.09.24/w=1920,quality=90,fit=scale-down)
117. Side Status Notification
91. Bubble Status Reading 
93. Welcome Screen with Background_08.28.52_p._m..png&w=1920&q=90)
_08.28.52_p._m..png&w=1920&q=90)
129. PDF Show & Download_21.22.04/w=1920,quality=90,fit=scale-down)
190. Ask Email for Playing Video
168. Anfibia - Natural Article Rating
79. Out of downloads_10.13.56_p._m..png&w=1920&q=90)
_10.13.56_p._m..png&w=1920&q=90)
176. Wordpress.com - Natural Inputs with Suggestions
133. Website-Browser Notification Reminder_08.04.40_a._m..png&w=1920&q=90)
_08.04.40_a._m..png&w=1920&q=90)
208. Checkbox for User Confirmation_23.27.14/w=1920,quality=90,fit=scale-down)
98. Features on Signing-up_07.32.46_p._m..png&w=1920&q=90)
_07.32.46_p._m..png&w=1920&q=90)
173. Toggl - Onboarding Action Tooltip
202. Apple Reminders - List Widget Customization_12.18.26/w=1920,quality=90,fit=scale-down)
118. Whereby - Pricing Step on Sign Up_06.19.15_p._m..png&w=1920&q=90)
_06.19.15_p._m..png&w=1920&q=90)
3. Apple Safari - Search Options on Focus
55. Contextual Form Input Errors_03.59.07_p._m..png&w=1920&q=90)
_03.59.07_p._m..png&w=1920&q=90)
170. Figma - Fixed Form with Steps
170. Figma - Fixed Form with Steps
83. Rewards Notification on Topbar_23.36.31/w=1920,quality=90,fit=scale-down)
78. Apple iOS - Dark & Light Color Themes
86. Table Column Slicer
25. Apple - Two-factor Auth_01.18.51_p._m..png&w=1920&q=90)
_01.18.51_p._m..png&w=1920&q=90)
2. Youtube - Feed Filter Tabs_11.42.00_p._m..png&w=1920&q=90)
_11.42.00_p._m..png&w=1920&q=90)
54. Modal for Language & Region Picker_16.58.20/w=1920,quality=90,fit=scale-down)
159. Wix - Natural Language Form_14.57.25/w=1920,quality=90,fit=scale-down)
23. Suscription gimmicks
110. Vertical Perspective Grid
11. Intercom - Likert in chat
196. Video Story on Website
66. Products Discounts
24. Window Maximize Options
39. Youtube - Dismissed Bottom Popup_10.22.23_p._m..png&w=1920&q=90)
_10.22.23_p._m..png&w=1920&q=90)
126. WeTransfer - In-front Site Terms_16.08.33/w=1920,quality=90,fit=scale-down)
66. Actionable Empty State_19.04.51/w=1920,quality=90,fit=scale-down)
38. Youtube - Video Statusbar_02.05.03_p._m..png&w=1920&q=90)
_02.05.03_p._m..png&w=1920&q=90)
85. Bottom Popup Secondary_06.44.52_p._m..png&w=1920&q=90)
_06.44.52_p._m..png&w=1920&q=90)
60. MercadoLibre - Ecommerce App Searching (3)
104. Slack - Creating & Customization Workspace_18.45.21/w=1920,quality=90,fit=scale-down)
80. Contextual Input Status_12.12.09_p._m..png&w=1920&q=90)
_12.12.09_p._m..png&w=1920&q=90)
135. Stories From Network_11.48.24_a._m..png&w=1920&q=90)
_11.48.24_a._m..png&w=1920&q=90)
58. Getting on Fitness
47. Notion - Workspace Types_09.48.53_p._m..png&w=1920&q=90)
_09.48.53_p._m..png&w=1920&q=90)
21. Apple MacOS - Advanced Color Picking_13.57.49/w=1920,quality=90,fit=scale-down)
75. Notification Recommendation
22. Mailchimp - First Mailing Campaign
172. Contextual Popup for Service Upgrade
84. Pandemic Warning Message on Map_01.20.51_p._m..png&w=1920&q=90)
_01.20.51_p._m..png&w=1920&q=90)
37. Branded Illustrations for Reinforcement
35. Do Not Leave Popup_04.17.01_p._m..png&w=1920&q=90)
_04.17.01_p._m..png&w=1920&q=90)