Menu
Close
Helping a clunky website builder improve the overall user experience and learning curve for new users. Warhead is a website building web application that utilizes a 3 panel system to allow users to craft custom websites with a true live preview of the end users view point allowing for the designer to truly see and understand the end user experience.
Warhead is an established website builder that had a very steep learning curve and issue bringing in new users due to some issues in user experience. While the overall concept and aspects allowed for a very robust and near limitless design and build custom build ability. Understanding and utilizing the multi panel system was clunky and at times confusing as users would be jumping between the 3 panels numerous times with the specific controls varrying in each panel based of what the user is doing. Because of this many users would end up lost or confused as the dynamic nature of the panels allowed for a more streamlined build enviornment they weren't defined and thus hard to understand when they would work how a user wanted. We spent a lot of time using the existing program and experiencing both the good and bad aspects of the builder allowing us to pull the various pieces apart to begin crafting a much more intuitive experience.
The biggest challenge coming into the project was maintaining the vast amount of control and flexiblity the builder gives a user in building a website from the ground up. By creating a flow chart of how all the panels worked together and separtely from eachother we were able curate a user flow that allowed for a much easier user experience as well as even greater flexiblity in how users would utilize the program. No longer using all three panels in conjuction but allowing for each panel to control specific aspects of the website build, thus allowing for them to also be hidden when a user is not using them. This lead to an overall user experience that further solidified Warhead as a unique builder in the market that allows the designers to see exactly how the final published website will display and perform for the end user.
With the structure figured out and the interactions of the three panels solidified. We were alble to currate each panel to it's specific focus, the primary layout grid panel, the elements panel which houses the overall html structure and elements called blocks, the third and final panel being styles which houses all the css controls to style a websites elements. All these panels would work inconjuction to a discreet upper navigation bar that would allow for ease use hiding and showing these various panels as well as importan controls for the overall site builder such as mobile website views and the abiltity to save or save as your theme. By introducing icons for the various preload css features like overflow we ensured that users would be able to quickly identify the styles they were wanting to utilize. This same concept was used for the various elements which are prebuilt common website components and html structure to allow a use to quickly and easily add their desired elements even if they are new to the terminology. The overall redesign of the application resulted in a far more intuitive user experience allowing for easier adaptation of new users.
