{"id":18381,"date":"2019-11-14T05:58:56","date_gmt":"2019-11-14T13:58:56","guid":{"rendered":"https:\/\/www.uxpin.com\/studio\/?p=18381"},"modified":"2021-09-02T20:09:34","modified_gmt":"2021-09-03T03:09:34","slug":"new-pages-panel-and-ui-changes","status":"publish","type":"post","link":"https:\/\/www.uxpin.com\/studio\/blog\/new-pages-panel-and-ui-changes\/","title":{"rendered":"New Pages Panel and UI Changes"},"content":{"rendered":"\n

After improving Layers<\/a> last month, we\u2019re excited to launch the improved Pages panel and a reorganized Top Bar. While Pages come with a set of features and performance improvements, the new Top Bar has now more space and keeps related things together.<\/p>\n\n\n\n

Pages and Layers in one panel<\/h2>\n

Up until now, Layers and Pages were two separate sections in Quick Tools. From now on, you can access both in the left corner of the bottom bar with a single click.<\/p>\n\n\n

[videojs_video url=”https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2019\/11\/BP_pages.mp4″ controls=”false” autoplay=”true” loop=”true” muted=”true”]<\/p>\n\n\n

You can collapse the Pages panel by dragging the horizontal line that separates Layers from Pages all the way up or double-clicking on it. When the panel is collapsed, a down arrow will appear next to your current page name. Clicking the arrow icon expands the Sitemap, where you can quickly switch between pages. So if you’re dealing with a large project with plenty of pages, you\u2019re going to love this one! Read more about it in Docs<\/a>.<\/p>\n\n\n\n

A whole new context menu <\/h3>\n

Right-clicking on a page name in the panel opens the new contextual menu with a full set of features for the page you\u2019ve selected \u2013 add a page, delete, open in a new tab, duplicate and rename. To rename a page even faster, double-click on a page name in the panel and start typing.<\/p>\n\n\n\n

Delightful experience and better performance<\/h3>\n

Another great way to show how much we\u2019ve improved the performance of pages is to compare adding, reordering and duplicating pages before and after the changes. <\/p>\n

To add a new page<\/b> right below your current page, just right-click on the page name and choose Add Page. This adds a new page immediately below your current page and opens it. Previously, adding new pages was possible only from the top of the Pages panel. Plus, you always had to name the page before it was sent through the network and appeared on the list.<\/p>\n

You\u2019ll also notice a big difference when you reorder<\/b> your page by dragging and dropping them on top of each other. Before the change, you\u2019d have to wait before the pages get grouped. Now, it happens in the blink of an eye.<\/p>\n

When it comes to duplicating<\/b> pages, we\u2019ve made it work a lot faster than before. You can now duplicate multiple pages at once. <\/b>Gone are the days when you had to do it separately for each. Better still, if a page has child pages, duplicating it will copy the entire tree at once.<\/p>\n

On top of that, there are two new ways of selecting multiple pages<\/strong>. Shift-click selects the first page, last page and all pages in between, whereas Cmd-clicking allows you to pick selected pages.<\/p>\n\n\n\n

Hide the entire UI<\/h2>\n

If you want to view your design without the UI, you can now toggle the visibility of the entire UXPin UI by using the Cmd \\ shortcut (Ctrl \\ on Windows).<\/p>\n\n\n

[videojs_video url=”https:\/\/www.uxpin.com\/studio\/wp-content\/uploads\/2019\/11\/BP_zen-mode.mp4″ controls=”false” autoplay=”true” loop=”true” muted=”true”]<\/p>\n\n\n

Reorganized Top Bar<\/h2>\n

Just as mentioned in the headline, with this update our Top Bar has been a bit reorganized. We’ve shuffled things around a bit by putting together options that are related. Here\u2019s what\u2019s changed:<\/p>\n