We Perform a Client Discovery

Once you’ve gone through the discovery and design phase of the project life cycle, your Project Manager will begin preparing for the development phase. At this point, your Client Strategist has created your project plan and your budget is set. We then will take that project plan and will create individual tasks for the development team. We then work with the Lead Engineers to determine how many hours each task will take.

This step is critical for budget planning. We try to always assign tasks based on the developer’s skill set. If we know a developer is strong and fast in a particular area, then we want to make sure that developer gets that particular task. They will likely need less time so that saves precious hours that can be allocated elsewhere.

We also set aside hours for QA, calls, project management, and launch. These are items you may not realize add to the bottom line. We account for as much as possible so that there are no surprises later.

We Communicate to the Client Their Responsibilities

The best way you can help ensure the project stays on budget is to be as detailed as possible during this initial discovery phase. Let us know how the site should behave:

• What do you and your users expect?
• What are some pain points with your previous site?
• What functionality do you need?

User stories are not required but greatly help us during this phase. Vagueness and ambiguity in the project plan lead to budget risks down the line. One sentence can be interpreted in many different ways by the project manager, the engineer, or you. If you see any vague or ambiguous statements in the project plan, work with your Client Strategist to clarify before the project starts.

Being thorough and detailed initially will prevent us from having to use more time to redo a certain feature down the line if it doesn’t meet your expectations.

We Inform the Engineers of Your Budget

After we’ve broken the project into individual tasks and estimated hours, we schedule a kickoff call with the engineers. We go through the project plan budget to ensure the engineers are aware of what they are building and how much time they have to build it. It is at this time they can raise awareness if they think a particular task is going to take longer than anticipated. Knowing this ahead of time allows for us to shift more hours to that particular task.

We Take Special Measures to Ensure the Project Is on Budget

The Project Management team monitors the hours being spent on tasks daily. When an engineer gets close to reaching their allocated time for a task, we will determine if the task is on budget. If that task is at risk of going over budget, we then see what ways we can make that time up. There may be a task that came under hours that balances the one that went over hours. Minor overages are expected, but if the overage is becoming severe and that particular feature turns out to be more complicated than expected, we will work with you to see if there are other areas of the site we can simplify.

WebDevStudios also adheres to coding practices that ensure we spend less time debugging during the QA phase.

We’re Open to New Requests

When I went shopping to prepare for my trip, I only thought I would be purchasing clothes. As I was leaving the mall, the guy at the kiosk asked if I wanted to also get my teeth whitened. This was not something I had planned for or expected but now knew I needed because… #birthdayselfies.

During the development process, you may discover new functionality that your website needs but we may not have accounted for it in the budget. This is expected. To make sure we stay on budget, let us know what that new functionality is and we will add it to a backlog. After development is complete, we will go through the backlog and complete new items if the budget allows. If we’ve exhausted the budget, we will work with you to increase the budget to account for those new things.

Final Thoughts

As I prepare to head back home to Las Vegas, I’ve come to some realizations about budgeting. I had an amazing and spontaneous trip! It did not go exactly as I had planned it, but I stayed committed to the budget I had set. Instead of wasting money on a hotel, I opted to stay with family and allocated more of my budget on front-of-the-line passes at Universal Studios and trying new restaurants.

The initial budget planning is key but so is managing that budget throughout the project life cycle. It requires commitment, diligence, flexibility, clear communication and the ability to handle unexpected situations. By using these steps above, we can reach our ultimate goal of delivering great websites on budget—just like I was able to enjoy a memorable birthday weekend while remaining within my own budget.

When you’re ready to have a website project delivered on time and completed on budget, contact us. We’d love to partner up!

The post Guide to Completing Website Projects on Budget appeared first on WebDevStudios.

Know and Understand Your Target Audience

The first task in the design process is to gather and analyze user data to determine your primary demographic. This can be done via analytics if you have an existing web presence, or focus groups and word of mouth information if you’re new to the web. In either case, you have some information about your target demographic that’s grounded in fact. Knowing and not making conjectures about which group of people are responsible for the largest and second-largest percentage of revenue is an important first step in laying the groundwork for a successful design.

The goal is to build for and strengthen the relationship you have with your primary demographic but to enhance the experience of your secondary demographic, while not actively trying to alienate other users. Knowing that you’re attempting to attract engaged couples, for example, and tailoring your design choices toward that demographic will go a long way to ensure your website is clear, appealing, and mitigate any potential loss in conversion as a result of a change in website design.

Each group of people informs aspects of design including colors, type choices, imagery, and layout just to name a few. But they also inform physical interaction with the website as well. Baby Boomers on average need some hand-holding when navigating websites, especially those that are content-heavy, while the 25-35 age group would be more adept at website navigation, but also expect certain considerations by default. Age or disability may also limit your color palette or font selections. If your target demographic are dyslexic your font choices are fairly limited to ensure that they can read and navigate without issue.

Many people may see a dip in conversion or sales because the users are completely taken aback by the change; this is normal for a new website design. The successfully planned design will ensure that you bounce back from that downward spike. The number of design considerations that are directly impacted by your demographic(s) is broad and ever-changing, but it’s never a good idea to design for yourself or because “it looks cool” when your driving force behind your new design is to increase user engagement or conversions.

Have Goals

Before you even speak with a designer, it’s imperative to understand the goal of your new website or even why you need a new website. Understanding the purpose of your website and/or why your current website isn’t successful is important in preventing similar pain points and issues down the line.

I typically ask clients one simple question, “Why?” Why do you need a new design? Really think about that, because “it looks old” does not necessarily make a difference if you aren’t sure why you need a website, or who your users are.

Your website might be out of date or isn’t mobile-friendly, but that isn’t a good answer to that question. Sure, updating things and making sure you’re mobile-ready is a fantastic way to improve user retention in the short term, but it’s just a temporary bandage. Your company should know what the goals of your website might be: user account registration, sales, interaction, sharing, etc. Obviously, there isn’t just one point of conversion on a website or one reason a user might visit, but knowing that along with your target demographic(s) can provide insight into how the users will interact with your new design, how you can provide easy access to your point of conversion, and funnel users without additional effort.

The Website is NOT for You!

It’s for your users. Of course, you have control over the design in as much as it should follow your brand guidelines, but beyond that, the fact that YOU like a slider or YOU love the color orange doesn’t mean it’s a good idea to include those elements, especially if it could harm user interaction and retention. You need to think about your users first and push personal preference to the wayside, keeping in mind that you are most likely not in your target demographic or age range.

One of the most common follies of new website design is to fall into a trend. Every year there are predictions for the next, and there are endless lists of trends based on the most popular website designs from the big five: Facebook, Google, Apple, Amazon, and Microsoft. Those design decisions are based on data and planning and are made with a purpose. Apple may have a fatty animated header which informs the current trend, but adding this element to your website because it is the current trend or because it’s “cool,” and not because it improves the user experience, flow, or retention is a mistake. I’m going to go out on a limb and say unless you’re Apple, your product is not an Apple product. If your main source of revenue is user signups, that should be the first thing visible to a user on all pages in some respect (unless they’re logged in). If the first thing a person sees when visiting your website is unrelated to making that happen, your design has failed and your users will bounce.

Think about your users. Do you need to waste dollars on an app-like experience, or pages upon pages of dense content when a single HTML page and two paragraphs will get the job done? Be mindful of your goals and avoid trends to provide a more purposeful and timeless user experience.

Don’t Neglect the Content

Just because your design is in good shape doesn’t mean that your website will yield positive results. It’s important to consider content, content flow, content interaction, and client expectation when designing a new website. At a micro level, not considering “real” content may change the design in a way that isn’t favorable, pushing elements to new lines or cramping blocks that rely on white space to be successful. Since no content is created equal, an extra check in advance ensuring that your design and flow still function as expected, once the site is built, is greatly beneficial.

At a macro level, there are two reasons that your users are visiting your site: to get information and to do a thing. If either of those elements is abstracted by design, your website is a failure. In fact, content typically informs users enough to make an educated decision about what they want, where to get it, and how to get there. Providing content that is explicitly tailored to your users and your goals will provide an optimal user experience and direct and limit the design to bring focus to those goals. We’re not just talking about the “About Page” but information blocks and navigation, too. The biggest pain point for user interaction and user experience is just not being able to find the information they need at a glance.

Content in many ways is as important or more important than the design itself. The design may direct your users with proper formatting, call to actions, buttons, layout choices, etc, but content provides users with the ability to get the information they need and convert. The optimal and most direct path for a user helps to avoid frustration and cognitive dissonance.

Summation

Design is more than just pixels. The design gives a website purpose and an inherited understanding of users. Design controls user flow and direction. Design should build upon your brand and content and elevate the user experience on the web and mobile devices. Working design-first for your own personal tastes without an understanding of your users, the goals, or content your design will fail, no matter how “beautiful” your website might be.

Now, you’re ready to think about the future and the goals of your company, make informed decisions about your new website or app design, and really come to the table with a sound, rational reason for that amazing design.

The post Plan a Website Design Your Users Will Love appeared first on WebDevStudios.

Project Initiation

Once we have a signed proposal/contract, our Client Strategist is ready to start project initiation. In this phase, we schedule various project discovery sessions to get a detailed understanding of general project goals, design requirements, and website data details. The goal of the discovery sessions is to get as much information in order to outline a detailed project plan. The project plan specifies the project design and development requirements.

Design Phase

A majority of clients that we work with desire a refreshed design for their website. We work directly with the client to get an understanding of design requirements and turn those into Figma mock-ups. We typically go through two to three rounds in the design phase: initial, revised versions, and finalized mock-ups. Our design team ensures that we provide the latest web design elements, while considering responsiveness and accessibility.

Data Migration

If you are migrating from another content management system, or want a fresh WordPress install, your website will require data migration. The data migration phase typically starts by providing WDS access to your database, or your database files. With access to your database, our development team pulls together a data mapping document, writes a data migration script, and starts the import process. Once we complete the initial import into our development environment, we do a quality assurance review against the data mapping document to ensure all content imported correctly. Our development team will be working with your actual data during the development process to ensure the launch process goes seamless.

Active Development

Once we have the final approved designs and project plan, our development team is ready to start programming your website. In this phase, we will create all page templates using the coding standards that we have put in place here at WDS. Our team will code custom features and functionality based on your project requirements using custom code and plugins. Additionally, throughout the development phase, our lead developers perform code reviews on all features to ensure proper sanitization, caching, and security are in place.

Quality Assurance (QA) / User Acceptance Testing (UAT) Review

Once all development tasks are complete, our development team performs cross browser and device testing to ensure responsiveness and accessibility is in place. We run your new custom theme through our WDS theme check plugin. Our development team also runs a query monitor and report to ensure that the site is performant prior to launch.

Launch

Each new website/project that we work on has a unique launch plan. Typically, the following steps are taken during this phase to move the site from our development environment to your staging and production environment.

• Our development lead will set up staging and production environments on your host and set up deployments.
• We will then request a content freeze in order to start the final data migration process.
• Once the site has been moved over to your environment and a quality assurance test has been completed, you will be ready to switch the domain DNS/cpanel.
• And… your new WordPress website is now live for your company and users!

Support

WDS likes to guarantee our development work by providing a 30-day support phase post project completion. We use this time to squash any minor bugs or issues that came up during launch and make certain that your company is happy with your new website. We also offer extended or ongoing support and maintenance options for our clients.

Overall, WDS has set the standard for projects and project life cycles. We ensure that we provide quality WordPress websites based on our clients’ goals and requirements.

The post Project Life Cycle of a New WordPress Website appeared first on WebDevStudios.

WebDevStudios is thrilled to announce the launch of the new and improved TheSportsGeek.com! Working with Kevin McClelland, editor of The Sports Geek, was exciting. The challenge that he presented included the requests for a fresh redesign, a logo refresh, and a full-site-rebuild on WordPress. The original website was somewhat outdated, text-heavy, and in need of some visual pizzazz to better represent the energy of the client.

Admittedly, I’m not much of a sports guy, but that doesn’t prevent me from designing a great experience while concentrating on the important part: the content. We needed a plan focused on engagement and energy, while retaining the “sports” feel, so as to not alienate current users.

The Process

The first thing you might notice about the old site is that it’s plain; there is a lot of white and red. The header takes up the majority of “the fold,” and the site wasn’t mobile-responsive or mobile-friendly—a design that hearkened back to the early aughts.

“With the world switching to viewing websites on mobile devices, I knew I needed an updated and responsive website, but I was hesitant on getting a new website designed,” explains Kevin. “I thought the process would be confusing and difficult for someone like me who doesn’t have a background in design or coding. Thankfully the WebDevStudios team made the process very easy.”

Kevin came to the design with inspiration drawn from various sports, sports news, and sports betting sites like CBS Sports and Fantasy Pros. Three things they all had in common was that they were content robust, generally monotone, and very modular. So I started there and extrapolated.

“Every step of the way was carefully planned out, and there was an entire team working together to ensure I was happy with all aspects of the website,” Kevin says. “Communication was top notch throughout with weekly calls to keep me updated, and any of my questions or inquiries answered very quickly.”

The Layout

The typical user wasn’t spending much time on the site. Once signed up, users had the opportunity to receive emails with a bulk of fresh content. So, the primary goal was clear that user retention was important, but more so, user acquisition. The majority of the content on the old site was being served up long form without much imagery or differentiation in content. I needed ways to break things up. Enter the card.

A simple but effective way to break up content throughout the site, this layout solution comes in two forms: a “feature” visible on most pages and a general-purpose “card” visible everywhere else. Even the widgets are compartmentalized to keep things separate, but together.

Every part of this site was designed to create a hierarchy and separation between content; thus, influencing user focus, something that was sorely lacking in the old site’s layout.

The Colors

Red plays only a minor role in the new site design. Instead, blue and yellow take center stage, which are colors commonly used in the sports world.

I needed to keep things calm (blue) while bringing focus to elements throughout the site (yellow). Success!

The Header

The old site’s header, video, call to action, and a button is persistent on all pages, which is fine, but taking up that much real estate on a page can be problematic, especially on mobile devices.

Here, I’ve decreased that space requirement, while also giving users the ability to hide this block (not entirely) to clean things up a bit. Though the magic of javascript and cookies, that state (open or closed) is saved for the user; so, they do not constantly have to open or close that header block. Ahh, the internet… What can’t it do?

The Logo

The logo took shape after the site was well into the design phase, which is a fun little design challenge. We were left with a very specific space to fill in the header (longer than it was tall), a limited color palette given the darker blue background, and the need to somewhat refer to the original logo of the old site.

I kept things angular and in the vein of the old logo, but with a little extra flare, grabbing inspiration from existing sports logos, news sites, and for good measure some tech sites (for the geek).

The final logo design came out of our fifth choice, after a few minor tweak and solidifying the type… Voilà!

“When it was time to launch the website, I was eager to see what my followers/fans thought of the new design,” Kevin shares with us. “Within just a few hours of going live, I had numerous emails and tweets from people letting me know how much they loved the re-design; and since then, I’ve still had nothing but positive comments.”

Conclusion

Given several, albeit minor restrictions, we were able to give The Sports Geek a fantastic new look and feel without ignoring its roots. We’ve organized the content and provided a better mobile experience for those catching up on the fly. If at the end of the day, site traffic and new-user acquisition has improved by even a fraction, we’ve done our job. And that’s the power of design.

The post Our Redesign for The Sports Geek Is a Sure Bet appeared first on WebDevStudios.