First off, I would like to say that I think it is a great idea to learn how to code. It will benefit you in a lot of ways and help you become a better problem solver. However, your first website probably shouldn’t be a website for your company. The website for your company should have one sole purpose: make you money.
The problem with first time web developers/designers is that they learn a lot of cool little tricks and they try to use all of them on their website. They learn how to make a button flash, add a cool gradient, and make rotating slides that look amazing – at least in their eyes.
Everyone starting out does these type of things. I remember when I first learned a few tricks. I thought they were the coolest things ever. The problem was that none of those little tricks help any website make more money.
An experienced design team approaches a new design with conversions in mind. An experienced designer has all the same tricks but knows when and why to use them. Everything added to your website needs to be added to improve the customer experience, not have the customer leave and say “wow, that website was cool.”
So go ahead and learn how to code, but try it out on your personal blog, not your company image.
Responsive web design is extremely critical in today’s world; it is necessary for survival among the fittest. No doubt mobile browsing has blown up and continues to grow exponentially. There are times where no matter how good a company’s web site looks on the monitor, if it is not “mobile friendly” and the user gets a poor experience, well, the site might as well be deemed no good at all. On a personal level, I can relate to the importance of mobile browsing. For example, after giving someone my business card usually one of the first things they do is pull out there iPhone, and look at my portfolio. If my personal site was not built with a responsiveness to adapt to different media devices and viewports such as the iPhone; and the viewer looking at my work does not have a good experience, this could jeopardize the integrity of my work and in turn, possibly be loosing future customers and contacts. I would like to quote Andy Clarke, web designer, author and founder of Stuff and Nonesense. Andy says, “Anything that’s fixed and unresponsive isn’t web design anymore, it’s something else. if you don’t embrace the inherent fluidity of the web, you are not a web designer, you’re something else. Web design is responsive design. Responsive Web Design is web design, done right”…
People remember 20% of what they read and 80% of what they see. Research shows that Instagram engagement is 58 times higher per follower than Facebook. Therefore, if your brand is looking for more social engagement, you should not underestimate Instagram’s marketing potential.
A couple ways to optimize Instagram is first by implementing the basics. Whether you already have an account or are just setting one up, you may run into the problem of your company name already being taken. This is where it is important that you are implementing your company logo as your profile picture for all social media across the board. Consistency in social media will help people quickly recognize your content wherever they may be. Your Instagram bio should express your company’s personality in a brief description of what your company does. It would also be beneficial for you to include a link to your website so people can find you on the Internet.
The best part of Instagram is posting attractive photos, so I encourage you to get creative with promoting your product. Do not post basic product shots with an interesting filter. That is not likely to draw attention for ‘likes’ or more ‘followers.’ Your posts should look “branded” in the sense that they are consistent with the online voice you are building behind your company. It does not always have to be about selling something. I encourage you to share behind-the-scenes photos—maybe a company event or a typical day in the office— both are interesting and make you more accessible to your audience. Don’t forget, video is fair game too for this; more behind-the-scenes action, showing reactions to your product or funny promotions, all help bring your brand to life on Instagram.
A brand makeover has to potential to completely rejuvenate a dying brand. If you are attempting a makeover, make it noticeable. The reason you are rebranding is to be noticed, so commit to the change in your brand. Any companies’ makeover should include a visual component to help the businesses re-establish the lines of communication with customers. Whether that’s new packaging or a redesigned logo, these tools have the potential to engage audiences to rediscover the brand.
In making your first steps at rebranding, the first thing to do is have your team go back and identify your existing audience, and then identify your new audience. If there is no difference between your current and desired audience then find where the miscommunication lies—failing to focus on a clear, identifiable audience leaves the brand at risk of trying to do too much and often backfires into reaching no one.
The benefits of brand rejuvenation entail the potential opportunity to communicate the shift in business model, as well as allowing you to transform your brand into new markets and audiences. Rebranding allows you to update the company’s mission and vision, which will ultimately re-engage employees as well. The ultimate goal in rebranding is to strengthen your brand’s messaging and allow it to evolve. When rebranding it is important to stay true to the brand’s mission as it should support your core message while connecting with your established audience in a new and authentic way.
For this weeks blog I decided to interview a friend of mine and professional graphic/web designer.
What do you think is one the most important thing as a web designer? Thinking past static design & layout to consider the web at all screen sizes.
What about the creative process? We use a repeatable, successful pattern. It starts with sketching, wire framing, mock ups, rapid prototyping and then development .
How important is the creative process to you? Very! Synapse didn’t have designers a few years back, it was developers doing front end. Having designers makes a huge difference in the usability of web applications. Being classically trained as a graphic designer helps me daily in web design. I use the principles of design, like color theory, rhythm, balance etc. these fundamentals are paramount!
What is your outlook on simplicity? Simplicity depends on necessity. That is one thing designers forget with the web design and graphic design in general. They feel like they need to fill all the space like it is some “hole to fill” esp. junior designers. Question the necessity of everything you include in the design and then question whether is it presented in the best way possible.
What about the the placement of things like “call to actions?” You want to make sure your main call to action is available and accessible almost anywhere. If you’re delivering information you want it at the end of that information. It should be the most prominent path for a user to take.
What do you think about traditional web placement i.e. headers etc. and switching the placement of them up, in non traditional ways? It really depends on the users of the site or app. Sites that have the same user base are better candidates than sites that have mostly unique visitors. Additionally, younger, more techie users are going to figure out the placement of things and are less likely to get frustrated. With users that struggle you probably want a more conservative layout. You have to determine purpose of the site and the target audience. A marketing site is going to be selling products/services, reference website will be delivering information etc.
Any input for junior web designer? Mobile first approach, responsive design and write clean code!
The psychology of color is one of the most interesting and controversial aspects of marketing. There has always been debate on the importance of color in marketing and its effect on persuasion. According to a study titled, The Impact of Color in Marketing, Satyendra Singh describes that the typical person makes up their mind within 90 seconds of their initial interaction with either people or products. She also claims that about 62-90 percent of the assessment is based on colors alone.
It is believed that the most effective colors for advertising are those that stimulate the viewer’s senses. Warm colors, such as red and yellow, are known to make people feel comfortable, and encourage them to linger—a reason why many restaurants primarily use warm color schemes. Nearly all logos, advertisements, and menus of fast food chains feature reds, oranges, and yellows. This is because warm colors are some of the best colors for advertising food, as they are known to increase the appetite, which may translate to higher revenue.
Cool colors on the other hand, like blues and greens, are very calming colors often associated with knowledge and understanding—why many businesses tend to use a cool color pallet. Darker shades of blue are known to indicate dependability and integrity making it a good color for business ads and logos; you will often notice financial companies incorporating dark blue. Shades of light blue seem to be very effective for advertising over-the-counter medicines and other health products. It is believed that light blue has a calming effect on people and it is most often associated with health and healing.
One last color pallet to point out is black and white. People often underestimate the power of the simplicity behind a black and white color scheme. According to research, these are two of the best colors for advertising because they create a strong contrast when paired together. Black and white often indicate opposites—white associated with purity and freedom, while black is interpreted as elegant, powerful, and/or evil. However, when used together, black and white can give off a highly professional feel for the brand.
A web sites web banner is by far one of the most important area of a site. It is what people see first, this is where the viewer makes initial visual contact and gets an overall feel and vibe of the site, and ultimately decides if they want to continue on or not. I can not tell you how many web sites I have left due to the fact they had a weak header. Even though it is the content that matters in todays world people judge books by there covers, and the web banner is the cover. I like this piece of information I found online, it is from a graphic designer and multiple business owner named Dawn Papandrea-Khan. She states, “usually when we visit a website or blog, we can get a feel for what the site represents in only a few seconds. This is the reason why it is even more important to focus on making the right first impression through a custom header graphic.”
As a designer, there are a few key aspects and bits of information I think the header should contain. The company, the product etc. Which brings me to my next point I found in an online blog talking about this exact topic. This is from boostability.com the importance of a header.
1. Who are you? (You would be amazed how many websites make their visitors dig around to find out the name of the company!)
2. What do you do? (Again, the number of visitors who are forced to assume your site sells a product rather than just talks about it is ridiculous. Be clear!)
3. Why should I buy from you, not the other guy?
The web is littered with garbage, visual noise and a bunch of sites that house web banners that all look the same. It is up to me as the designer to produce clean, visually interesting web banners that represents the sites overall demeanor and entice people to stay on the site and explore further. It is also up to me to find new and exciting ways to display the content so we can separate ourselves from the crowd. Also, I feel like in design I have to take risks. I have to try new and “edgy” things and think outside the normal design box that I often get tunnel visioned in. I would also like to explore maybe trying a banner with out the traditional rectangle box, maybe another shape or placement? That is something definitely for the sketchbook and some thought.
The goal of a landing page is to collect information from site visitors with the hope that they will be converted into a customer. From a business standpoint, we would like as much information as possible from these potentials. However, the average site visitor wants to spend as little time as possible filling out the contact form to get access to the offer they’re trying to receive.
In an article from HubSpot’s Social Media Scientist, Dan Zarella, looks at which types of form fields lower or increase customer conversation rate. From his studies we are able to analyze the best approach to a successful contact form.
In Zarella’s studies, he found that as the number of form fields increases, conversation rates of customers slightly decrease.
This graph represents as the number of single line text fields increase, there is a small decrease in conversation rate.
This next graph shows that multiple text areas have a noticeably shrinking effect on conversation rate.
Lastly, this graph proves that multiple drop down fields, can lower your companies conversation rate.
We can infer from Zarella’s study that the fewer form fields implemented on your landing page will bring you greater conversation feedback. In fact, conversation rate improves by almost half when the number of form fields are reduced from four fields to three- that is a 50% increase!
A few small details that will keep your contact form most efficient is by reducing all friction. The more friction you can eliminate from the user experience, the more your conversation rate will increase. One way to do this is by creating trust on your page. Reconsider the information you are requesting in your form fields; if you do not need it right away, get it from the user later. Another thing you might want to consider is providing the user with help text. By utilizing help text, you are telling the customer exactly how to fill out the form by eliminating any extra thinking on their end. Last but not least, don’t be afraid to design your contact form; it should be memorable to the customer, as well as clean, simple and efficient.
To me, one of the most important parts of the creative process is sketching. Usually coming right after the initial brainstorming, it is essential for to me to start getting ideas out of my head and onto the paper. This part of the creative process is critical, and is often overlooked or not even used at all. For me, to really explore layout possibilities and new areas it begins with sketching.
Sketching can vary from project to project. For a logo design I might start 45 minutes of straight sketching, with out erasing not making it look pretty just getting ideas out of my head and onto paper. From there I would pick maybe 3-5 of those and focus on those, then narrow those down making visual decisions, repeating this process.
It helps me to understand and study the space before I go into the computer. It helps to find new positions, things that are static and centered are predictable and often visually uninteresting, (there are times when static positioning is effective, situation dictates.) Basically when I sketch, I am not going into the design “blindfolded” or rolling with the punches that technology throws at me. I need a foundation, and that is sketching, you can’t build a house with out a foundation!
Web design is much more than how a site might look in the eye of the viewer. An effective website is primarily focused on form and function. As a designer, it is important to not get caught up in the look of the site, but to go back to the skeleton and focus on the layout of the content you are working with. It does not matter how talented you are in Photoshop and Illustrator, if your content is randomly scattered along the page, the appearance is messy, unorganized, and difficult to navigate, resulting in sub-optimal Google Analytics.
This is where a grid system is very effective. A grid system is used to arrange content into a clean, organized structure by implementing horizontal and vertical lines. By arranging content in consistent way like this, the presentation is much more readable, making it easy for the viewer to absorb.
A few things to keep in mind when designing your page layout is the “F” pattern design. Eye tracking studies have identified that when people enter a website, they quickly scan the page in an “F” shape pattern; left to right, and top to bottom. This is evident that your design must have an effective flow line. A flow line typically enters the page from the top left-hand corner, carrying the eye horizontally across the page. This is the base of your structure for you to impose starting and stopping points when aligning your text and images.
Your grid should organize your graphic elements in relation to the page, as well as each other. Whether you decide to implement a three-column, four-column, or six-column grid—commit to it. Consistency is the most important thing as it will only help you later when applying your content to the page.