IBM • 2019 • Product Designer
IBM • 2019 • Product Designer
Podium
Podium
Overview
Overview
Overview
Context
Context
IBM has thousands of webpages designed to support their Business Partner community. This includes product pages, technical resources, agreements and pricing information. Each page was designed from scratch and required a designer, developer and content expert, this process took almost a month and meant that pages quickly became out of date or visually inconsistent as the brand evolved. Podium is a "what you see is what you get" webpage builder, in other words, it's a no-code tool like Framer or Webflow but custom to IBM. It was built to enforce consistency and to save time and money in realising webpages.
This project was led by Molly O'Rourke and Matthew Parish, when I joined IBM I took full design ownership of all new features and became the sole designer for 12 months.
IBM has thousands of webpages designed to support their Business Partner community. This includes product pages, technical resources, agreements and pricing information. Each page was designed from scratch and required a designer, developer and content expert, this process took almost a month and meant that pages quickly became out of date or visually inconsistent as the brand evolved. Podium is a "what you see is what you get" webpage builder, in other words, it's a no-code tool like Framer or Webflow but custom to IBM. It was built to enforce consistency and to save time and money in realising webpages.
This project was led by Molly O'Rourke and Matthew Parish, when I joined IBM I took full design ownership of all new features and became the sole designer for 12 months.
Results & Impact
Results & Impact
4 hours
4 hours
4 hours
is the total time it takes for a webpage to be built using Podium. It used to take 22 days (97% time reduction).
is the total time it takes for a webpage to be built using Podium. It used to take 22 days (97% time reduction).
1/3
1/3
1/3
of the previously required resources/skills are now needed. It removed the designer and web developer. The content expert is fully empowered to create and maintain pages.
of the previously required resources/skills are now needed. It removed the designer and web developer. The content expert is fully empowered to create and maintain pages.
System
System
System
Bands
Bands
Bands are the page sections and are pre-styled to adhere to the IBM Business Partner brand guidelines, requiring very little design decision from IBM's content experts creating the pages.
Bands are the page sections and are pre-styled to adhere to the IBM Business Partner brand guidelines, requiring very little design decision from IBM's content experts creating the pages.
Toolbars
Toolbars
Toolbars are contextual to the band or element. When you click on a button you see the relevant settings for that button, limiting the options for those who aren't tech savvy or familiar with web design.
Toolbars are contextual to the band or element. When you click on a button you see the relevant settings for that button, limiting the options for those who aren't tech savvy or familiar with web design.
My Contribution
My Contribution
My Contribution
Table Bands
Table Bands
Tables were a heavily demanded band type and 150 of the existing webpages already featured them. IBM's content experts desperately needed tables to facilitate comparison of levels, pricing and product benefits. Based on an analysis of the existing tables across the website, I identified two reoccurring tables that I was able to design as "ready made" bands to prevent the content experts recreating the table from scratch each time. I also added a custom table to provide flexibility.
Tables were a heavily demanded band type and 150 of the existing webpages already featured them. IBM's content experts desperately needed tables to facilitate comparison of levels, pricing and product benefits. Based on an analysis of the existing tables across the website, I identified two reoccurring tables that I was able to design as "ready made" bands to prevent the content experts recreating the table from scratch each time. I also added a custom table to provide flexibility.
Table Toolbars
Table Toolbars
I expanded the existing rich text editor to support inline links, as well as the addition of columns and rows when creating tables.
I expanded the existing rich text editor to support inline links, as well as the addition of columns and rows when creating tables.
Agreements Project Type
Agreements Project Type
There were hundreds of pages across the website that featured agreements/terms and conditions. I created a brand new project type which provides a unique subset of bands to allow agreements to be easily updated and maintained, whilst maintaining their legal/formal look.
There were hundreds of pages across the website that featured agreements/terms and conditions. I created a brand new project type which provides a unique subset of bands to allow agreements to be easily updated and maintained, whilst maintaining their legal/formal look.
Contact
These short project overviews barely scratch the surface of my process, the immense challenges we encountered, and the rich collaboration that took place, but hopefully it was enough to spark your interest.
Contact
These short project overviews barely scratch the surface of my process, the immense challenges we encountered, and the rich collaboration that took place, but hopefully it was enough to spark your interest.
Contact
These short project overviews barely scratch the surface of my process, the immense challenges we encountered, and the rich collaboration that took place, but hopefully it was enough to spark your interest.