DNN Website Design Process

Getting Started With a Customized Process for DNN

Most of the sites we build feature completely custom themes instead of templates for all Content Management Systems and DNN is no different.

The design process starts with understanding your needs. Our team will meet with your project stakeholders to discuss your target marketing, competition, and goals for the web development project. From that meeting, our team will develop a complete UX Analysis.

This analysis allows us to create the necessary resources for your site including a sitemap, wireframe and high-fidelity mockups. All of which are tailored to the DNN CMS.

Sitemap Development For Your DNN Website

A sitemap lets you take a closer look at your website's pages and how they flow into each other. It doesn't really matter here that your site is in DNN. The impact on SEO and UX that a sitemap has goes beyond the CMS. Careful consideration here helps serve your site for years to come.

When completed, your new sitemap will show all the important pages, documents, and other resources on your site in one convenient location. After identifying the elements, we will sort them into visual hierarchies, and clearly represent traffic between them by adding connecting lines. Many times this shows where you will need to create additional content. We work with you to identify where content is needed to build the new site and where that content will come from. Some examples are from an existing website, a brochure, or even a current video. Your sitemap will serve as a blueprint for your new site.

Wireframe Creation For DNN

With the sitemap completed, the next step is to develop a wireframe of your new DNN website design. A wireframe uses basic boxes and lines to define spaces on the page, clarify branding and navigation, and indicate where the text will reside. This is all done before the actual images and content are created. A website wireframe is a great way to clarify your vision for the entire web development team. Foremost Media will develop a wireframe mockup of your website's homepage and other key pages, as needed.

The wireframes help to make the design process iterative. Instead of combining the functionality/layout and creative/branding aspects of the website in one step, wireframes ensure these elements are taken in one at a time. This allows you (and other team members) to provide feedback earlier in the process.

Wireframe layouts also help:

• Save time and money on development costs.
• To get all parties involved in the new website on the same page about what the website is supposed to do and how it should function.
• Our coders view website mockups to ensure they are developing a framework to accommodate the vision. They also use website wireframes to verify they are including branding and navigation on each page.​

High-Fidelity DNN Mockups

Our UX experts will convert your approved sitemap and wireframe documents into an interactive mockup for your team's discussion during the graphic design phase. The graphic design and UX team will lay out your website based on the UX analysis, your company's branding guide, marketing materials, and input from you.

There is a lot of subjectivity and personal preference when it comes to website design. While we talk all of this into consideration, you hire us because we are the experts. There are certain ways to design a website that are right and wrong. We know the difference between subjectivity and the right way to design a website. When working with us you will know the difference too.

As part of the custom website design, we will get into details, such as how the navigation will look and function. During this phase, your team will have the opportunity to make revisions to the website design until you feel satisfied.

This phase's deliverables are an online interactive prototype of what the site will look like. You will be able to post and share comments on the art itself with your team as well as ours via a sharable online link. You will be able to use this link to send to all stakeholders for final approval of the art.

During the build phase, our DNN developers will take the approved graphic design, sitemap, and wireframes and write the actual code needed to deliver you a fully-functional website built in the DNN CMS. Web design best practices, such as cross-browser compatibility, optimized code for good performance, clear navigation, and minimal load times will be a constant focus during the build process. During this phase, you will have a link to view and provide feedback on the site as the build progresses.