The Oak AI Intranet Designer helps you create content for your intranet without needing coding knowledge. You can create and edit banners, build custom content, generate colour palettes, and get inspiration for your homepage, directly from the Design Site.
The Designer generates Oak-safe, accessible HTML and CSS that works seamlessly across your homepages and content. Designs are responsive, consistent and ready to publish, without the risk of unsupported styles breaking your content.
You’ll also get step-by-step handover instructions for adding your design to Oak, making it easy to create sleek, modern content with no technical experience required.
Before you start:
- Check with your IT/Compliance team to check you are authorised to use ChatGPT or Gemini
This guide covers:
- Accessing the Designer
- What the Intranet Designer can be used for
- Adding your designs to Oak
-
Writing effective prompts
Accessing the Intranet Designer
The Designer is available in ChatGPT and Gemini. You can access the Designers from the oak.design.com navigation menu.
You do not need to be logged into your ChatGPT to use the Designer, however Gemini requires you to be logged in.
Note: Only use AI if your organisation's policies allow. Nothing you share in the ChatGPT Intranet Designer trains the GPT. It also cannot access or reveal any confidential information from other users or customers.
What can the Intranet Designer be used for?
-
Homepage Inspiration: The intranet designer is connected to design.oak.com which allows you to describe what you would like from your homepage. The designer will then recommend relevant homepage designs from design.oak.com and suggest applets that best suit your needs.
-
Generate a colour palette: Build a cohesive, accessible colour scheme. All you need to do is provide your primary brand colour and the designer will create a full tonal palette, including homepage background, primary and secondary tones, and applet backgrounds.
-
Build Custom Content: Describe the type of banner you would like, reference examples from design.oak.com, and upload an image example of a banner design you like.
-
Build on the design.oak.com banners: Paste the source code from an existing banner or from one in the Oak Design Pack (design.oak.com) and ask the designer to make changes; such as amending the style, adding/removing buttons, rounding the corners, adding overlays, or adding space for a background image.
- Reference websites for inspiration: Paste the URL of a website you would like to take inspiration for when building banners and custom content. The designer will grab elements of the URL, such as the colours and styling.
Adding your designs to Oak
-
If the Designer has generated code from your prompt, select Copy code in the corner of the response
-
In your Oak intranet, edit the homepage or content you would like to add the custom content to
-
Click on the pencil toolbox and find the Custom Content applet. Drop this onto the homepage or content where the blue line appears
-
Click on the textbox within the applet to reveal the Content Editor Toolbar. From here, select Tools and then Source Code
-
In the Source Code box, paste the HTML code and click Ok to preview the custom content
- If required, make further amendments in the Intranet Designer to build on your design. If you're happy with the created content, publish the homepage or content
Writing effective prompts
The quality of the response you receive from the Designer depends on the information and instructions you provide. A clear prompt helps the AI understand what you need and what you want the design or inspiration to look like.
Include useful details such as the purpose, style, colours, layout or specific design elements. You can also provide an image as a reference for inspiration.
You don't need to get the prompt perfect the first time. Start with a clear request, review the response and refine it through the conversation.
Prompt examples
-
I need design inspiration for a department homepage within the finance industry. The homepage should be communications-led, with a professional and engaging look and feel. Include a personalised welcome message, along with suggestions for the key content and sections that could appear on the homepage.
-
I would like to create a colour palette for a new branding theme. The primary brand colour is #03274F. Suggest a complementary colour palette that works well with this colour. Using the same theme, create a personalised banner design. The banner should include three small buttons with rounded corners and use the new colour palette.
-
I have attached an example image of a banner. Use this as inspiration to create a similar banner that follows the overall style and layout of the reference. Remove the rounded corners and position the text on the right-hand side of the banner. Maintain a clean, professional design while applying these requirements to the reference.