Missing Feature: Artists Taxonomy

My design team and I are currently working on a website redesign for an artists community here in town called the Creek Arts District (CAD). It’s a community of local artists that all have studios or galleries in this one part of town and are all walking distance from each other. The Creek Arts District is a popular destination for people visiting our city to see the unique artwork and perhaps buy a painting or some jewelry.

The website acts as a directory and a guide for tourists planning to take a stroll through the CAD. However, the taxonomy of the various artists is difficult to navigate in the current site. The current site does classify the artists by both their medium and by the building where their studio or gallery is located. But it’s all jumbled in an overwhelming list. The artists profiles share a page of the building where they are located, so you have to scroll through a list to find the artist you’re looking for.

Our solution is to split the artists’ profiles onto their own individual pages. The main “Artists” page would list all the artists with a category system that filtered them by the selection of buildings or media. Similar filter systems are used on ecommerce sites.

So we will use a custom post type for the artists’ profiles so that we can easily add or remove artists from the list. While we could have manually coded custom post types, we are using a free plugin call Custom Post Type UI that lets you build them quickly and easily.CPT UI Screenshot

We also need to specify customized fields to fill out the artists’ profile such as a description, hours of operation, link to their website, etc. So we are also using the Advanced Custom Fields plugin.Advanced Custom Fields Screenshot

This is a somewhat simple solution, but very effective in helping users find artists easily.

 

Advertisements

Project Management in Web Design

Designers sit at a table discussing a project.

Project Management is super important in keeping your projects from going absolutely nuts. Project Management is necessary for large teams and if you are just working as a freelancer. It is important to keep time, money, resources, and everyone involved in order.

There are various methods of Project Management that work for different kinds of projects.

I am a web designer. Yes, I make websites, but I also do branding and some print design. I mostly work with just a client and myself.

So the best system for me is the “traditional” method.

Traditional Project Management

Initiation

It starts with initiating the project: meeting with the client for the first time, discussing their goals and the services you can provide. You give them a project proposal which puts in writing everything that will get done and how much it will cost. You lay out a contract of terms and conditions. These documents and this first part of the process are so important as they are the basis of the rest of the project. Everything must be laid out as clear as possible.

Planning, Executing, & Controlling

This next part is a cycle of researching, designing, building, and revising.

This is where you further figure out what are the specific needs of the products. You brainstorm on ideas, find the appropriate theme, prepare wireframes, and create prototypes. Then you realize what’s missing in the design, and back up to more research or more sketching. You then continue this loop while checking up with the client, and meet your deadlines with the final products.

Closing

Don’t forget that closing the project with the client is just as important as the previous steps.  You give them all of the final products and put the website live. You receive final payments and provide any “support” resources and documentation necessary for the client to upkeep the website, etc.

You return to the proposal and contract documents and review. You confirm an agreement with the client that the project has been finished and all payments have been dealt.

 

So this is a quick overview of the “Traditional” method of Project Management. It seems to work best with projects that span a set time period with a starting point and an end point. It provides both the structure and flexibility necessary to ship a website, a logo, or print piece for a client.

I have a current project working with a start-up business that needs their company branded with a logo, some business cards and a website.

I started the project by setting up a project proposal, laying out the project workflow and a timeline with deadlines and payments.

The project will include further analysis of the goals of the business. A business name will be established along with a theme to guide the rest of the development of the project.  A logo will be designed that best fits the character of the brand and the name of the business.

After the name, logo, and design theme have been chosen and approved by the client, a business card will be designed. Wireframes and mock-ups for the website will also start to be developed alongside the business card. After the approval of the business card design, wireframing and construction of the website will continue with periodic check-ups with the client. Various revisions will be made according to what things I find to be missing or too complicated.

On the final deadline, when the website is finished, I will review everything with the client — the proposal documents and final products. The final payment will be paid.  We will then reach an agreement that I have done all the services I agreed to do, and he has submitted all the payments. The website will be made live, and the final materials will be given to the client.

And that’s basically it. He may later ask me some small questions, but anything larger would probably require some more documentation, and we might even have to go through the process again.

But that’s the way I manage my projects. I may tweak it as I get more experience, but it will still maintain this basic structure.

Why Blogging Is Beneficial For Businesses

So blogging is a big deal, right? Apparently 77% of internet users just in the United States read blogs, and 6.7 million Americans blog. I found a super in-depth infographic that gives a ton of statistics that confirms that blogs are pretty popular. And of course they are. Blogs are just people sharing various information with each other. Blogging is an easy way to share with the world what we’re passionate about.

Infographic on Blogging Stats

Benefits Of Blogging For Businesses

Blogging has so many benefits for all kinds of people and purposes, especially for businesses. It’s definitely something your business may want to consider picking up.

Hosting a blog on your website boosts traffic. Blogging helps potential clients see that you are well informed in your field. Researching information for blogs helps keep yourself sharp and up to date with the latest in your field. Blogging provides for great opportunities for networking with others in both your trade and in others.

Become An Expert Blogger!

Enjoy It

So how can you be a great blogger? Start by writing about what you genuinely enjoy writing about. If you start blogging just for the money or just for business success, you will probably burn out after a couple months when you don’t see growth. True passion will shine through your work.

Be Persistent

That being said, make sure to keep a consistent flow of posts. So often do people start strong, but die out after a few months (or even weeks). Push yourself to post once a week or every other week. Persistence is one of the most important values of a good blog.

Teach

Also put up some tutorials or tips on learning the tricks of your trade. Teaching not only helps someone else, but also helps you learn more. There is always someone else who doesn’t know what you know.

Keep To A Theme

Keep your content around a consistenttheme — not necessarily about one topic but one theme. All of your posts should be pointed towards a certain goal. For example, “to promote a healthy lifestyle” or “to share great coffee”. Your audience will come back for something similar to what they got last time.

Be Honest

Lastly, just be honest. Don’t rip off other people’s work. You’re better than that. Find your own unique style. Do your best to give the facts (but honest mistakes are okay sometimes too).

My Plans For Blogging

I personally plan on blogging on anything web design related. Specifically, I will post on various subjects related to my growth as a web designer like tutorials on software that I am currently learning. I will post analyses on the latest design trends and technologies. I will promote best practices in designing for the ever-evolving web. I may post tips on how to work as a freelancer like how to work with clients or how to deal with money and pricing.

 

As humans, we are quickly migrating towards utilizing the internet more and more, and blogs are such a big part of that. If done with love and perseverance, you will find blogging to be very valuable and rewarding for your business.

 

WordPress: Count Me In!

Wordpress in my toolbox

I have decided that WordPress.org is the content management system that I want to focus on learning at this point. WordPress just excels in so many ways, so it’s the first CMS I want to add to my toobox.

Why WordPress?

  1. WordPress is open-source!
  2. The customization WordPress provides is utterly invaluable. It can be used to create a blog, business website, and ecommerce among so many other uses.
  3. The user base is gigantic! Just about every problem I may have is documented somewhere which makes debugging a bit less stressful. Plus there are so many resources that I can use to learn more.
  4. WordPress provides effective ways to increase Search Engine Optimization.
  5. WordPress has so many plugins that allow me to extend a website in a variety of directions.
  6. WordPress’s control panel is relatively easy to use, not just for me but also for clients that I may pass it on to. Plus I can edit or add new content from any computer.

Of course, WordPress isn’t ideal for every website’s needs. However, I think WordPress is a valuable tool that all web designers should have a good understanding of. WordPress is used by so many website creators and continues to be a strong player in the web community.

 

 

3 Of My Favorite Web Resources

I have been in web design for just eighteen months, so I’m trying to get a grasp on what technologies to learn, what I want to specialize in, and how to get started in the field. I have found countless great resources that are helping me advance my understanding and continue to learn about the amazing world of web design, but here are just 3 for now.

Twitter_logo_blueTwitter

Twitter and social media really can be more than just a time killer; it can actually be quite invaluable. I have created a list including just web developers and designers that post the latest research, developments, and trends in web development and design. They do often post unrelated content, but the nuggets they post are golden. Plus they refer to great blogs that also keep up with web-related content. Here are some people I’m following:

Hugo GiraudelSara SoueidaBrad FrostChris CoyierJen SimmonsLuke Wroblewski

CSS TricksCSS Tricks

Chris Coyier’s CSSTricks.com is an elemental resource for getting into web development. Beneficial for both beginner and veteran developers, csstricks.com is a great resource for answering just about any question about CSS and related topics.

SeanWes PodcastThe SeanWes Podcast

In the SeanWes Podcast, hosts Sean McCabe and Ben Toalson discuss the best practices in becoming a freelancer. They discuss core principles of dealing with clients, pricing, self-management, and the process of building your own business. I have found the information and experiences they share to be so incredibly helpful. Maybe start with Episode 46 about how to price your services.

 

 

WordPress vs. GetSimple

Wordpress logo versus GetSimple logo

WordPress is one of the most popular database-driven content management systems (CMS) providing a relatively easy way to create a website. But it may be overkill for some small businesses that don’t need all of its extended features. GetSimple is a lesser known, flat-file CMS. Flat-file CMS’s keep all of the content in file folders rather than storing it in a database on the server. Each system has their own strengths and weaknesses.

WordPress is much more robust than GetSimple. It also has a much wider user-base than GetSimple, thus providing much more plugins, themes, and support. WordPress provides features like blogging, commenting, and so many more plugins that allow the user to expand their website as necessary. But because of its vast functionality, WordPress can be a hassle to handle and maintain.

GetSimple on the other hand is much smaller and straightforward than WordPress. Providing less functionality than WordPress, GetSimple is best for basic websites with a relatively low amount of pages. It doesn’t really provide for blogging and comment systems (though there are some plugins). Because of its lack of fancy bells and whistles, GetSimple is much easier to use; the interface is much cleaner. However, because of its simplicity, GetSimple isn’t appropriate for websites that are intended to expand.

Both WordPress and GetSimple are easy to start up. It’s just a matter of downloading the files from the website (wordpress.org and get-simple.info). WordPress does require an extra step to set up a database for the site content. After connecting it to the server, each CMS provides a simple login process. Setting up is as simple as that.

Then, it’s just a matter of choosing the theme and adding your websites content. Adding new pages and setting up menus with either CMS is super easy. Each has a fairly intuitive interface. As you can see in the images below, WordPress is much more robust while GetSimple is very minimalistic.

WordPress Interface

WordPress Interface

GetSimple Interface

GetSimple Interface

In conclusion, WordPress and GetSimple have different intended users. WordPress is for the website that plans to expand and establish a larger web-presence. GetSimple is best for small businesses that don’t require extensive features on their websites. Both CMS’s do a great job in helping the user manage their content effectively.

Syntactically AWESOME Stylesheets: An Intro to Sass

Sass logoAs a web designer, you may have come across design blogs, tutorials, and job listings that mention Sass. And you may have left it in the pile of web-dev jargon to look into later. But Sass is not a technology that you want to miss.

Sass (Syntactically Awesome StyleSheets) is a CSS preprocessor, a tool made to advance your CSS styling making your code easier to read and easier to edit, plus add a world of powerful features. (There are actually several CSS preprocessors out there. Two other popular ones are Less and Stylus.)

CSS preprocessors have arisen to popularity in the last decade as some web developers have become frustrated with the limitations of CSS. Sass was first released in 2007. It was developed from another language, Ruby, but uses the same syntax as regular CSS. Sass’s .scss files compile into .css for delivery. Let’s check out some capabilities of Sass’s syntax.

Features

Variables

With variables, you can set a value like a color or font and refer to it when needed. Then if you need to change the value, you only have to change it once, and your whole document is set.

$font-stack:    Helvetica, sans-serif;
$primary-color: #333;

body {
  font: 100% $font-stack;
  color: $primary-color;
}

Nesting

Sass allows you to nest your CSS selectors, just like HTML.

nav {
  ul {
    margin: 0;
    padding: 0;
    list-style: none;
  }
  li { display: inline-block; }
  a {
    display: block;
    padding: 6px 12px;
    text-decoration: none;
  }
}

Inheritance via @Extend

Sass’s @extend feature allows you reference the CSS properties of a previous selector and apply them to following selectors.

.message {
  border: 1px solid #ccc;
  padding: 10px;
  color: #333;
}

.success {
  @extend .message;
  border-color: green;
}

.error {
  @extend .message;
  border-color: red;
}

Mixins

Mixins allow you to re-use chunks of CSS that you find yourself using often. You can even include variables to make them more flexible. Mixins are especially useful when dealing with vendor prefixes.

@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
       -o-border-radius: $radius;
          border-radius: $radius;
}

.box { @include border-radius(10px); }

Benefits

As you can see, Sass provides a way for some incredibly powerful features to benefit your website production. It provides a simpler syntax that is much easier to read and write. Sass can also help boost your website’s performance (if done right) with cleaner code, wider browser compatibility, and faster load times. Also, Sass improves your workflow, helping you develop more efficiently.

Drawbacks

There are some drawbacks to using Sass and CSS preprocessors alike. Just like any other language, Sass can be abused, bloating your code and complicating your workflow (See some problems in this critical article). It is a syntax with its own best-use standards to be mastered and bug-fixed. It is important to realize that these tools should never be a substitute for good architecture. In fact, experienced developers recommend that you get comfortable with CSS before diving into preprocessors.

Also, Sass is somewhat mutually exclusive, meaning you can’t work on the same stylesheets with another coder who writes in traditional .css files. (But of course, Sass works magically if your whole team uses it in the workflow.)

Resources

To learn more about Sass, you can visit the website sass-lang.com. Or you can watch video tutorials by  LevelUpTuts on YouTube, or by paid tutorial websites like Lynda.com or Drupalize.me.

Sass and pre-processors may not be for everybody. Many professionals are using Sass or other CSS preprocessors to optimize their project workflow. While CSS may obtain similar features as preprocessors in the future (but not too soon), Sass and CSS Preprocessors can boost your workflow, so I definitely recommend trying it out.