Creating your website – Synchronized user interfaces

Creating your website – Synchronized user interfaces
17 February 2012 | | Creative Design, Internet, Marketing

When planning and designing your dental website, there are often many factors to consider. It is very easy to get carried away with planning the content displayed on your website (e.g. text and nice looking images), but realistically, although improving content quality, these factors are definitely not the most important when trying to ensure website success.

In fact you should concentrate on making the user experience as good as you possibly can. For example, you should put yourself in the mind of your target audience/customers and decide exactly what you would want/expect to see on a dental website – what goals you wish to achieve from visiting a dental website. For example, a well structured navigation system and call-to-action’s could prove to be a lot more rewarding, that text and images. The following article explains this further…

In the design field there is a deep understanding of intuition vs science. Often designers will stress when trying to perfect a layout. This could be within sizes, positioning, page structure, color theory, or a whole host of other categories. But as you mature your design senses grow with you, making it a lot easier to craft pixel-perfect interfaces.

Below I’ll be going into some great tips for UI designers. We’ll mostly be focusing on designing for the web (browser-based apps). But mobile designers may take to heart a lot of the same information. And since intuition can only carry you so far, it helps to take a step back and understand the more methodological processes of interface coordination. You don’t need to know anything about Adobe Photoshop or HTML to understand this article, but it certainly won’t hurt!

Question your Processes

We all get stuck into loops. Or as we prefer to call them, schedules. These are the daily routines we follow through to get our objectives completed. There’s nothing inherently wrong with this, but how often do you stop to question yourself? This is an important part of growing as an interface designer and as a person.

Since we use tons of interfaces every day it seems like we’d understand how they work best. And from a designer’s perspective, analyzing websites can give you some great ideas towards structuring your own projects. But when you take a step back you begin to notice that not all interfaces are created equal. Below is a small list of some questions you should ponder:

  • What are my users’ goals on this page?
  • How can I make it easier for the user to complete their goal?
  • What are the most important aspects of this page? should I remove or add anything?
  • Is there possibly a better/quicker way to do this current task?
  • Who else has done something like this on their website? Should my functionality mimic theirs in any way?

If you can put aside 5-10 minutes to think about these questions you’ll surely come to a sound conclusion. You should take note that ultimately any website is being created for the user’s sake. It doesn’t really matter how perfect or spicy the page looks, only that it works in simplicity.

Lock Down your Objectives

It helps to come into the process masking yourself as an anonymous user. Pretend you are any standard user logging onto your website. What goals are you looking to accomplish right from the home page? Can you currently find where you need to go for these?

The answers may surprise you. And they will vary from each type of website or web application. Sometimes users are looking to update their profile, or maybe upload photos. Other times visitors may be looking for a specific page. There are a lot of websites which strictly offer information – how quickly can you find the page you’re looking for? And subsequently, how quickly can you spot the information in text?

If it would be easier, try listing out a flow chart for a mock set of user interactions. Create a few aliases and give them objectives to complete on your website. Then either write or type a flow chart for each of their clicks and actions to get where they need to go. In this process you may notice some glaring flaws in your design work. This is by far one of the most useful techniques for nailing down some of your poorer interface choices.

While going through your pages also consider each section of typography. Are the fonts large enough, maybe even too small? This one is a bit more tricky since you likely can’t mimic the conditions of your users. Everybody is on a different type of system running many varying monitor resolutions. But you can at least get an idea of how your fonts display in the average web browser. From there you can update with slick new font styles to match your template design.

Arranging Page Elements

This is a really big aspect to consider on each of your pages. Most likely you’ll be running a mock design template which mirrors itself on each page. This means many of the overhead details will stay the same from page-to-page: headers, navigation bar, any sidebars, etc.

Since you’re always looking at the same template you may personally gloss over awkward layout elements. Try bringing in a colleague or friend for suggestions. You don’t need to apply their changes, but getting a 3rd party to look over your design gives you some external perspective into the issue. Just keeping things simple will always work in your favor. Users like things simple and easy to access, which also gives you less work.

Try also to remove cluttered areas with buttons and links scrunched together. When you first land on the page what grabs your attention? This should be whatever your users are most likely looking for! If that’s content, make sure your headings stand out bold and proud. Maybe your users will be looking to register or log into your website. If that’s the case don’t throw a form down into your sidebar, make sure it’s easy to find and work with.

If possible try sketching a basic mockup of your website components. You don’t need to match any color settings or detailed graphics. Just boxes with labels and maybe some arrows to describe the page flow (drop-down menus or other jQuery effects). Synchronicity is key here. Whatever changes you decide to apply should be site-wide. This rule can be excluded if you’re working with many different types of pages.

For example, a portfolio gallery will look much different than a user profile page. This is because the people viewing these pages will have completely opposing goals. You should certainly try to match colors, buttons, and at least your heading area to reduce confusion. Toying around with a mockup in Photoshop can give you a lot of ideas for these different page layouts.

Gathering User Feedback

Every web designer should understand that user feedback is vitally important. It may be the most important part of your contacts on any website. Without visitors, your website is just a lonely part of the World Wide Web. So their opinions may not always be perfect, or even good, but you should always make it possible for users to offer their feedback. Particularly in the simplest fashion you can.

If you know how to develop small contact forms PHP is a versatile language. Although for WordPress users there are many alternatives. Even if you can’t use either, just adding an e-mail address somewhere onto your site makes it much simpler for user contact. If you’re a passionate UX designer you may even consider adding an entire page dedicated to user feedback and bug reports! It’s a great way for startups to pinpoint errors in their design with their userbase as a free market.

Conclusion

Arranging perfect and harmonious user interfaces is a very difficult task. By no means is anybody the perfect web designer. It does take years of practice to fully understand the mechanics behind digital graphics and design theory. But you don’t need a degree to understand how user experience works.

This article should have gotten you thinking into some new realms of creation. Approach each website you visit with a keen eye, and try to take away some perspective for your own designs. If you have suggestions or ideas for synchronizing web interfaces please offer them in the comments area below.

More posts from our team


Previous Post:
Next Post:

Back to all news

Reviews2024
Five Star
Reviewed Marketing
5 gold stars
google review logofacebook review with 5 stars
"Excellent service from James at Dental Design, thank you very much for your prompt attention whenever I get in touch! Would definitely recommend to a friend" Alison Tarmey View Full Testimonial
Google reviews logo "Would definitely recommend to a friend"
5 gold stars
"As a dental practice manager I cannot recommend Dental Design highly enough. They are just brilliant at what they do. Lucy and her colleagues are just an email or a phone call away...." Emma Smith View Full Testimonial
Google reviews logo "I cannot recommend Dental Design highly enough"
5 gold stars
"Really great company to deal with. They always respond quickly and are truly reliable. I would 100% recommend, the staff are so friendly and helpful." Michelle Molloy View Full Testimonial
Google reviews logo "Really great company to deal with"
5 gold stars
"I got increased traffic and new patients applying to my surgery, once Dental Design upgraded my website. They are very professional, efficient & adaptive to new situations..." Joanna Gallop View Full Testimonial
Google reviews logo "Very professional, efficient & adaptive to new situations"
5 gold stars
"Lucy has been a star, responding to and acting upon our requests in a prompt, efficient and professional manner, as well as the rest of the Dental Design team..." Abhay Shah View Full Testimonial
Google reviews logo "I cannot recommend them highly enough"
5 gold stars
"...Since the website has been up and running Lucy Mander has been our point of contact. She has been invaluable and gone out of her way to help us, especially during COVID-19 lockdown... " Lucy Jones View Full Testimonial
Google reviews logo "Has been invaluable and gone out of her way to help us"
5 gold stars
"Thank you for all your help and support, and the provision of valuable learning aids for our patients and staff alike in these difficult times. We love the look of our practice website. Very professional!" Sandra Luck View Full Testimonial
Google reviews logo "We love the look of our practice website. Very professional!"
5 gold stars
"Dental Design stood out both in their knowledge of the industry and their professionalism and can-do attitude. All of their staff are exceptionally competent and knowledgeable..." Harvey Rook View Full Testimonial
Google reviews logo "Dental Design stood out both in their knowledge of the industry and their professionalism"
5 gold stars
"Having done extensive research into all the dental website companies, the team and package offered at dental design was unrivalled..." Neil Shah View Full Testimonial
Google reviews logo "The team and package offered at dental design was unrivalled"
5 gold stars
"The team at dental design (especially Rosie) are absolutely fantastic and are always on hand to help. They are professional, friendly and extremely efficient. Rosie always gets back..." KiKi Wilmot View Full Testimonial
Google reviews logo "absolutely fantastic and are always on hand to help"
5 gold stars
"Dental Design are fantastic to work with, our website is amazing and the support they provide is second to none. Our account manager Rosie L is a fabulous point..." Luke Lucas View Full Testimonial
Google reviews logo "Dental Design are fantastic to work with"
5 gold stars
"Having worked with the Dental Design team for the last six months, I've found them not only helpful, but friendly and approachable too. I bombard Marcus with regular..." Sophie Harper View Full Testimonial
Google reviews logo "always met with a swift and professional response"
5 gold stars
desk with branded documents