Back to SFProto
Experience Cloud portal design

Design an Experience Cloud portal: several pages, one brand

The Portal design workspace is for the site a customer or partner sees. Start from a Customer Help Center, Partner Central or Account & Billing template, or a blank LWR site; set the brand once; build each page from Experience Cloud components; link the pages; and click through the whole site before anyone builds it.

One brand, every page

Branding holds the site name and logo, primary, secondary, accent, surface and text colours, the header style, the heading and body fonts, a hero image and overlay, spacing and corner radius, and the footer. Change any of it and every page follows, so the portal always looks like one site, never a set of mock-ups that drifted apart.

Built from Experience Cloud components

  • Hero banner with search and buttons, featured topics, trending articles, case deflection, community feed, partner scorecard and quick-action tile menu
  • The same SLDS record components as a Lightning prototype, for account, case and order pages inside the portal
  • Drag components in from the palette and change them in Properties, as in the prototype studio

Pages that link, a site you can walk

  • Navigation items, hero buttons, tiles, topics, footer links and the profile menu each open another page
  • Press Interact and click through as a visitor would; the canvas moves between pages as the real site would
  • Share the whole portal with a link; add ?page= to open a particular page

What it is for

  • Showing a customer service team what their new help centre will look like before the Experience Cloud build starts
  • Agreeing a partner portal's pages, navigation and brand with a partner manager in one session
  • Handing the build team a clickable reference, with the portal as JSON

SFProto is invite-only while we test, and free for testers.

Ask for an invite at support@sfproto.com, or open the studio if you already have one.

SFProto is made by Cloud Mavericks Pty Ltd and is not affiliated with Salesforce. Salesforce, Lightning and Experience Cloud are trademarks of Salesforce, Inc. Terms · Privacy