[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"examples-content:\u002Fexamples\u002Fscreens\u002F7cce4053-cb0c-41fb-bb20-3977124cfd89":3,"content-store-meta":-1},{"canonical_path":4,"template":5,"family":6,"indexable":7,"seo":8,"breadcrumbs":12,"content":21,"examples":26,"showcases":95,"links":96,"dates":107},"\u002Fexamples\u002Fscreens\u002F7cce4053-cb0c-41fb-bb20-3977124cfd89","detail","screens",true,{"title":9,"description":10,"og_image":11},"Plans · Dock - Nicelydone","Screen UI design example from Dock. The screen displays a settings interface with a two-column layout. The left column features a vertical navigation menu,…","https:\u002F\u002Fassets.nicelydone.club\u002Ff\u002F7cce4053-cb0c-41fb-bb20-3977124cfd89.png",[13,16,19],{"label":14,"to":15},"Examples","\u002Fexamples",{"label":17,"to":18},"SaaS screen examples","\u002Fexamples\u002Fscreens",{"label":20,"to":4},"Plans · Dock",{"title":20,"eyebrow":22,"description":23,"sections":24,"body":25},"Screen design","Screen UI design example from Dock. The screen displays a settings interface with a two-column layout. The left column features a vertical navigation menu, categorized into 'Settings', 'Brand', 'Data management', 'Products', and 'Advanced settings'. The 'Products' category is expanded, and 'Plans' is the currently selected item, highlighted in light gray. The right column, which is the main content area, is titled 'Plans'. Below the title, there's a primary 'Create' button with a dropdown arrow on the right, and a search input field labeled 'Search by name...'. A table occupies the central part of the content area, displaying a list of plans with columns for 'Featured \u002F Favorited', 'Name', 'Workspaces', and 'Publish status'. The 'Featured \u002F Favorited' column header shows a down arrow, indicating a sort order. Two rows are visible in the table: 'Mutual Action Plan' and 'Admin To-Dos', both with '0' workspaces and 'Draft' publish status. Each row also includes a star icon (unfilled), a heart icon (unfilled), and a three-dot 'more options' icon. At the bottom right of the table, pagination controls are visible, indicating '1-2 of 2' items, along with 'first', 'previous', 'next', and 'last' page navigation icons. The top right of the screen features a user avatar and a logo, accompanied by a dropdown arrow.",[],[],[27],{"uuid":28,"title":20,"description":29,"canonical_path":30,"image":11,"width":31,"height":32,"image_alt":33,"published_at":34,"kind":35,"patterns":36,"component_categories":60,"app":81},"7cce4053-cb0c-41fb-bb20-3977124cfd89","The screen displays a settings interface with a two-column layout. The left column features a vertical navigation menu, categorized into 'Settings', 'Brand', 'Data management', 'Products', and 'Advanced settings'. The 'Products' category is expanded, and 'Plans' is the currently selected item, highlighted in light gray. The right column, which is the main content area, is titled 'Plans'. Below the title, there's a primary 'Create' button with a dropdown arrow on the right, and a search input field labeled 'Search by name...'. A table occupies the central part of the content area, displaying a list of plans with columns for 'Featured \u002F Favorited', 'Name', 'Workspaces', and 'Publish status'. The 'Featured \u002F Favorited' column header shows a down arrow, indicating a sort order. Two rows are visible in the table: 'Mutual Action Plan' and 'Admin To-Dos', both with '0' workspaces and 'Draft' publish status. Each row also includes a star icon (unfilled), a heart icon (unfilled), and a three-dot 'more options' icon. At the bottom right of the table, pagination controls are visible, indicating '1-2 of 2' items, along with 'first', 'previous', 'next', and 'last' page navigation icons. The top right of the screen features a user avatar and a logo, accompanied by a dropdown arrow.","\u002Fexamples\u002Fapps\u002Fdock\u002Fscreens",3024,1758,"Plans · Dock from Dock","2026-07-13T15:30:47.000Z","screen",[37,46,55],{"id":38,"label":39,"slug":40,"rank":41,"group":42},89,"Pricing","pricing",0,{"id":43,"label":44,"slug":45},9,"Plans & Limits","plans-and-limits",{"id":47,"label":48,"slug":49,"rank":50,"group":51},13,"Filter & Sort","filter-and-sort",1,{"id":52,"label":53,"slug":54},2,"Actions","actions",{"id":56,"label":57,"slug":58,"rank":52,"group":59},7,"Add & Create","add-and-create",{"id":52,"label":53,"slug":54},[61,65,69,73,77],{"id":62,"title":63,"slug":64},240,"Horizontal navigation","horizontal-navigation",{"id":66,"title":67,"slug":68},168,"Accordion","accordion",{"id":70,"title":71,"slug":72},169,"Avatar","avatar",{"id":74,"title":75,"slug":76},175,"Button","button",{"id":78,"title":79,"slug":80},211,"Pagination","pagination",{"slug":82,"title":83,"logo":84,"baseline":85,"categories":86},"dock","Dock","https:\u002F\u002Fassets.nicelydone.club\u002Flogos\u002Fdock-k4tgvy1y.png","The new way to manage external relationships",[87,91],{"id":88,"title":89,"slug":90},23,"Collaboration","collaboration",{"id":92,"title":93,"slug":94},29,"Task Management","task-management",[],[97,99,101,103,105],{"label":57,"to":98},"\u002Fexamples\u002Fscreens\u002Fadd-and-create",{"label":48,"to":100},"\u002Fexamples\u002Fscreens\u002Ffilter-and-sort",{"label":39,"to":102},"\u002Fexamples\u002Fscreens\u002Fpricing",{"label":104,"to":30},"Dock screen designs",{"label":106,"to":18},"All screen examples",{"published_at":108,"updated_at":109},"2026-07-11T10:21:13.000Z","2026-09-05T20:20:29.223Z"]