Category: Design Page 13 of 22

From Design Rules to Thinking Like An App Designer

On May 31, 2015

Learning about Design? Design has rules, tips, tricks and techniques that you need to learn. As you learn, you realize that there is a right and wrong way to apply these. Some design rules can be broken. You need to learn when and how to break these rules.

20 Design Rules You Should Never Break

Canva’s Design School talks about 20 Design Rules You Should Never Break. When you are designing, you can break certain design rules. You first need to learn these design rules, so you can break them in a way that makes sense for the design. This article provides you with tips, tricks and rules on how to fix common design errors.
Thinking Like An App Designer

Why designers should never use fake text

Are your designs filled with fake text or lorem ipsum? Do you use it as a placeholder until the real text is ready? Jerry Chao explains why you shouldn’t use fake or dummy text. He suggests that you should write your own text. No matter how rough the text, you’ll see design issues that may not be found right away with lorem ipsum.

Flat Design vs. Material Design: How Are They Different?

Design styles change. New ideas on design can become popular quickly. Some are just fads that disappear. Anna Lisnyakn describes the difference between Flat and Material design. She gives you the pros and cons of each design style and helps you to decide which one works for your project.

What do you need to think like an app designer?

You want to work on mobile apps. How do you approach the design of mobile apps? Thinking like an app designer helps you to change your design thinking. To build mobile apps, you have to learn and unlearn new ways of designing. What works on a website, won’t work when designing a mobile app.

Summary

The more you design problems you solve the better you get at design. These tips help to learn what design rules you can break, why you need to design with real text and how to think like an app designer. What other design tips do you use?

Do You Need a Website Refresh or Redesign?

By admin

On April 28, 2015

In CSS, Design, Programming, Web Development

What do you do if your website is old or needs to change? Do you start over? Should fix what is not working for you? With a website, you have two options: refresh or redesign. Fix what you think needs an update or start over with a brand new site.
Redesign or Refresh?

Refresh or Redesign

What is a refresh? Fo example if your website was a house, a refresh would be like making over a room. To update your room, you may repaint the walls, replace a rug, curtains or even pillows and add new furniture. When you refresh your website, you leave the way the website functions and change how it looks. This may include changing the colors, fonts or even images.

What is a redesign? A redesign is where you start over. Instead of a makeover, you would tear the house down and build a new. With a website, you start over by building a new site.

When should I refresh my website?

Refresh or redesign? It depends on your needs. Why are you updating your site? Do you need to fix some small issues? Has your business changed and your website no longer reflects your brand? If you need to make small fixes, than a refresh will work for you. If you need to have it reflect how your business has changed, you want to redesign.

How do I do refresh my website?

Decide what your goals for the website are.
Look at your content and determine if you need to add, delete or update pages.
Prioritize what you want to work on.

What are you site goals?

When looking at a redesign or refresh, you should reevaluate your site goals. Is it performing the way you expect? Does it reflect your current brand? Are there any pages that just don’t work?

Do you know what content your site has?

Audit your website by figuring out how many pages you have and what they focus on. Is each page current, out of date or needs a slight tweak? Decide which pages you want to work on, remove and update.

Prioritize

What do you want to work on first? Does your content need updating? Do you need to change the look and feel first? Decide what you want to work on and schedule how you are going to accomplish fixing or updating your site.

Summary

Your website should change to reflect who you are as a business. This means you may need to either refresh or redesign your website. What you choose to do depends on your goals. Sometimes, your may need simple fixes and refreshes your website is the best choice. Other times, you may choose to start over because it is just easier and a better way to achieve your goals.

Practical UX Methods

By djbrensinger

On February 28, 2015

In Design, UX, Web Development

Practical UX Methods – as presented at FOWD 2014 from Patrick McNeil

Patrick McNeil share his practical, bite-size UX Methods: First Click Tests, SUS Questionnaire, Nano-Usabality Tests and Integrated Tests.

Have you used any of these methods?

How to Add Text To Photo

By djbrensinger

On December 26, 2014

In Design, Photography

Text On Photo Have you ever had a great photo that you wanted to add text to? Did the result work the way that you wanted it to? When you add text to a photo, it should compliment the photo not compete with it.

What techniques can you use to add text to a photo?

Here are 5 simple techniques you can use to add text to a photo:

You can add text directly to the image.
Insert a transparent shape and add your text to that shape.
Overlay the entire photo with a transparent shape and add your text to that shape.
Blur the image and then add the text directly to the blurred image.
Use a floor fade. Create a gradient that fades the photo from dark to light.

Presentation Panda on SlideShare tells you how and when to use these techniques. Every photo is different. They show you how to decide when to use these techniques. Presentation Panda shows you the right and wrong way to do each approach. Review this SlideShare presentation to learn about the best way to add text to your photo.

How To Overlay Text On Images (5 Simple Methods) from Presentation Panda

By adding text to a photo, you can customize a photo for your website or blog. Adding text directly to the photo is the simplest and easiest method. This method doesn’t work for all photos. Have you used any of the methods mentioned in the slides?

What is smart design?

By djbrensinger

On November 28, 2014

In Design, Programming, Web Development

As we use mobile devices, they change how we interact with our devices and content. Developers and designers need to consider many things when developing a website. You have to think about responsive design, speed, UI/UX, patterns, touches and gestures. Sara Cannon explains how mobile design trends affect how we design.

Smart design is

Content-focused
Fast
Informed
Refined

How to you create a smart design?

Be content-focused

Your design should be Mobile First, Readable, Designed for Content and uses digital storytelling. It just works. A visitor can read your site on their computer, laptop, tablet or phone. They can read your website using what ever device they choose. Make the content the most important part of the design. Use web design techniques, like photos, videos, fonts and more to help tell a story.

Be Fast

Your design should be fast. People have a limited attention span when it comes to slow loading websites. Make sure your site loads quickly. Sara talked about balancing speed vs awesome. Some photos may make a design look awesome, but they take time to load. You need to decide if that photo is really necessary. If it is, you can optimize the photo for the web. A tool that smushit optimizes photos for the web. You can speed up how your site loads by using tools like Icon Fonts and SVGs (Scalable Vector Graphics). You can get Icon Fonts from Font Awesome, Fontello or IcoMoon. Nounproject is one place to get svgs. By replacing icons with fonts, you can increase the speed of your site.

Be Informed

Every website performs differently. You have well and bad performing pages. By using Google Analytics or another web analytic tool, you can learn more about how your site is performing and find out what works. Not enough people do user testing. User testing of your website can tell you a lot about what works and what doesn’t. You can also learn why someone uses your site in unexpected ways. Use usertesting.com to invited people to help you test your website.

Be refined

A little bit of motion can add refinement to your website. Add animated navigation icons with CSS Transformations. The motion lets people know that something has happened.

Smart Design – Content-first, Fast, Informed, Refined. WordCamp NYC 2014 from Sara Cannon

When you consider a new website or redesigning an old one, think about how to focus on the content and not just making the site look pretty. A site that is readable, fast and just plain works is going to have more people using it than one that looks awesome. Remember to make a site that is content-focused, fast, informed and refined.