Layout

One of the things you have to consider is layout. What dimension will you be printing on? Since you aren’t constrained to the dimensions of the screen, you will need to select a size on which you will be designing. What kind of layout will you be working with? What kind of spacing will your typography need? Try experimenting with dimensions that are not standard paper sizes.

Paper

Another consideration to make is paper type. Would the message you are seeking to express with your typographic design be stronger if it were printed on a specific texture of the paper? Maybe the typography would appear better in a UV filter against flat elements and other areas of your design. Experiment with printing on different paper types and run a few print tests before you settle on basic printing options.

Interaction

The most interesting area that needs to be considered—in my opinion—is how others will interact with your typography. Will you be printing on a sheet that will require folds and die-cuts? Will ignoring die-cuts and interaction with folds best portray your typography’s message?

Final Thoughts

Go forward more by exploring the different ways you can push your typography. But as you are exploring the different areas, keep in mind that you should always be working with a grid system, and keeping consistency in mind.

What is a Good SEO Writing Topic?

A good SEO writing topic is one that will answer a question, offer useful information, or get others to link to it. In other words, it’s quality information that offers something that searchers need. A good starting point is to address what you really want to accomplish with your content.

• Do you want to attract links from outside sources? Focus on creating content that will appeal to a web-savvy audience that will reference your content (i.e. web designers, tech bloggers, etc.).
• Want to create a page that will work as a funnel for searches? Use blog content to create an “organic” landing page, and users can explore your site from there.
• Looking to move potential customers along in the process of using/buying your product or services? Provide them with information they need to make the next step.

How to Find a Topic

Now that you have a clearer idea of what kind of topics will equal effective SEO content, the question remains, where do I find these quality SEO writing topics? There are a few places, but keeping your goals in mind will certainly help you along the way.

One method is so obvious, it may not have occurred to you—ask the customers you all ready have. What are the questions they would like to have answered easily on your website? If you have a brick-and-mortar store, what do they like about coming in every day or week that they would enjoy seeing duplicated online? Maybe the enjoy recommendations from staff that regular product reviews could provide.

If you do not have the opportunity to ask customers for this information in person, there are other ways to get their feedback as well. You could make use of surveys that you can develop easily with free tools like SurveyMonkey among many others. If your company is large enough to have dedicated customer service representatives, they can also serve as a valuable resource for helpful topics. What are the issues that come up frequently when a customer calls or emails to get help? By publishing a blog post containing that information you can help push clients or customers along in the sales cycle and prevent a call to your representatives—all while creating something that might well be searched for. All of it means good SEO content.

Final Thoughts

In another post, I will address how you can use search data to determine good SEO writing topics as well, but for now, I’ll leave you with these final thoughts—write good content. Remember the intent behind every search is to find useful information and you will be well served. Ranking is all well and good, but if it’s achieved with lousy content, it will not lead to conversions or a high ROI.

Preface

Before you read this article, write down or at least think about what your perfect day is. I’ll get back to this later.

Reflecting on the past

Just this past week I finished my first year of the two-year VisComm Program at the University of Arizona. After reading Marianne’s reviews, I was reminded of where my classmates and I started. I was really bitter and reluctant about most of the prerequisite courses I had to take, but soon discovered how useful they ended up being. The Art History prerequisites helped me expand my awareness of design on a universal scale, which in return helped me determine what elements I could, and should, use to create a successful design. Even the FYE courses, the prerequisites I hated the most, ended up being an excellent outlet for discovering my execution techniques and short cuts—quality ones—that worked best for me. If you are a Pre–VisComm student reading this now, believe it or not, the skills you learn in the FYE courses become really handy when your instructors expect 50 thumbnail sketches, 5 well constructed packaging pieces, and close to perfect mounting skills within a 48 hour period. Hindsight is 20/20, and I am telling you now that those prerequisites are there to give you the opportunity to build your personal foundation—to make it as strong and efficient as you want it to be.

Application

Applying to the program was where I started to really have fun. The VisComm portfolio review occurs once a year during spring and you have what seems to be a 50-50 chance of getting in. Applicants are to submit a portfolio of 10-12 pieces, including the Portfolio Review Visual Assignment. This assignment is a visual response based on one of the two written pieces provided to you. Only 20 design students and 20 illustration students get accepted into the program, and those who don’t have to wait another full year before they can re–apply. I know a lot of students who didn’t get in the first time, but you can still take some of the VisComm classes, although you won’t have priority for them. I recommend doing this, so that if you’re accepted the following year, you can be on the same track as the rest of the VisComm students.

After being accepted into the program, I was excited to take the classes that really grabbed my attention like ART363A (Typography I), and ART361 (Digital Design Studio II). Those classes allowed me to explore design elements about which I was interested in learning. The first semester in the program was the more enjoyable half of the first year. This last semester was hell, complete torture, I couldn’t believe I had signed up for it.

So what changed from the first semester to the second? ART365, aka Design II. If I had to assign high school stereotypes to the VisComm courses, Design II would be the bully. Hands down. Some students will disagree with this statement, but the ones who do are probably the ones that didn’t push themselves, or their ideas, to do more. I remember our instructor telling us from Day 1 that this class was anything we wanted it to be, and that our ideas were not limited to the requirements. We were assigned to create a brand, and throughout the semester we had to design different elements of it. His statement made us realize that we were given the opportunity to take our own project and really push it. That idea alone led me and a few other classmates to live an unthinkable life: averaging 17 hours of sleep per week, spending several hundred dollars a month on printing and supplies, making daily showers optional, leaving dishes and laundry dirty for several weeks—if not months—and other unthinkable acts. But as odd as it might sound, doing that helped us break our limits, all so we could find the next one to break. For once, we were given the power to be all that we could be, and it was just too good of an option to ignore.

Final Thoughts

If I were given the choice to take the semester over, I would. I would double the load and do it again because the personal growth and strength that was gained from this past semester was the most valuable lesson I have ever learned from school. I’m not going to lie, as excited as I am about taking Design III next semester, I’m a little intimidated by it. Design III might just be the asshole of high school stereotypes, and I’m still recovering from the bully. As for Marianne, I’m excited to see how her design skills develop and what she will decide to submit in the 2014 portfolio review. I hope others will learn from my experiences in the first year of the VisComm Program.

To conclude my review of the U of A’s VisComm program, I’ll say it’s a great program, but only if you are open to seeing, and taking, the opportunities that are provided. If you need a better review, then look back at your answer of the perfect day. If you didn’t mention design in any part of it, then you may not find this program to be all that you want it to be. Just another thing I learned from my instructors.

Great logo design inspires me to create the best branding possible, so I’ve included the following examples I’ve come across recently to serve as logo design inspiration:

It’s been a few months since we gave the first introduction to our LISA project management system. Here is a progress report of what we’ve got going on.

First, we have a new LISA HQ home page. We are pretty excited about the new home page for LISA that we just launched a few days ago.

New design

We completely redesigned LISA to give it a more modern look, and to make it easier to use. We have sectioned off each module block, making it a lot easier to get the information you need with just a glance.

We have also updated the client side design significantly as well. We made it very simple, and focused on the phases of the project, and where it is currently, rather than displaying a lot of extraneous information.

New features

We added a ton of new features and improved the old ones. Here is just a quick a quick highlight of a few of them:

• Ticketing system 

  Now you can create tickets, assign them to users, comment on them and have different status for tickets. Tickets can also be placed on hold if needed.

• “Old” Status Notifications

  We noticed that we needed to keep track of when statuses become outdated. So now for each project you can set to track how long ago status message was updated.

• Sidebars

  We have moved the Calls and Clients tabs into sidebars, that way the information in them can be accessed more quickly, and on any page, without interrupting your workflow. The layout is also responsive, so it will adjust automatically when the sidebar is turned on and move the tabs out of the way.

• Calls 

  We have updated the way calls work, and we think it’s a big improvement. Now, multiple calls are grouped together per client. You can also log calls that already took place, and see comments on all past calls.

• Tasks 

  That’s right we added tasks into LISA! You can access your tasks from a sidebar or see tasks for each project. You can assign tasks to projects and people, set due dates and have ability to comment on each task as well. We still need to do some polishing, but it’s already pretty functional.

• Phases and Milestone Management

  We redid phase navigation and the user interface. It’s now extremely easy to mange project phases; you can also set up milestones and schedule them for specific dates.

Of course there are many more tweaks and updates to come, so if you are interested for a beta invite come let us know in the comments and include your email.

What Being “Reactive” Looks Like

When an agency focuses on executing a service for a client, it is easy to lose sight of their overall goals.  That’s a problem, because when you fail to align your services with your client’s goals, we quickly find ourselves becoming “Reactive.”  How can you tell if you are being Reactive? Often times, your first clue will be when a client comes to you and says something like, “I’m not hitting my numbers,” or “I’m not reaching my goals fast enough.” Sometimes, the client doesn’t even get to that point—they just move on to another agency. In those cases, it’s easy to be confused as to what went wrong. “We executed our end of the agreement flawlessly,” the thinking goes, “so why was the client unhappy?”

Be “Proactive”

This is where the power of being a “Proactive” agency becomes clear. Being Proactive consists of a range of distinct elements, including taking care, being attentive, understanding goals, and the having the ability to tell a client when it’s time to step up their game. Making sure that the client’s overall goal lines up with the plan currently in place allows you to see when things need change, or when other services need to be added in order to achieve a client’s goals. That is the heart of being a Proactive agency.

Honesty is the best policy

Don’t be afraid to tell a client when the services you’re providing aren’t cutting it. It is our job to tell our client’s what they need, but that is not always enough, as sometimes they cut much-needed services from their budgets.  Even if it’s not in the budget, we have a responsibility to let our client’s know what they need to do to reach their goals…even if that means they may move on to another agency.  Believe me when I say, they will move on much sooner if you are Reactive, not Proactive.

The Summer After ISTA

Summer 2012 was damage control time for me. I wanted to take courses I would have already completed, had I been an art major from the start. I took ART119 Contemporary Art & Theory online during pre-session with Larry Busbea. Of course, it was very fast paced but I thought it was great. I enjoyed it a lot because I already had an interest in 20th century art. This class ended up being greatly beneficial to me when I took my other art history courses, some of them upper division. The art I study in ARH300, ARH329, ARH429, and ARH202 are all things I saw in that short number of weeks of ART119. It’s a cool thing when all of your class material starts to come together.

Sophomore Year

By my sophomore year, I started taking studio courses. The university requires a total of 6 First Year Experience (FYE) courses. These are 3 hour classes that meet twice a week, for only 8 weeks instead of the usual 16. Three FYE’s are required: Mapping, Space, and Surface. The other FYE’s you can choose from are The Body, Propaganda, Amalgam, Experience, and Gaze. I had never taken studio courses until now and I will say that they can be rigorous and tiring. I had taken Mapping and Surface back to back which was somewhat regrettable at times. With my extra curriculars and everything else, I often felt pressed for time and sometimes my work suffered because of it. That said, I never left a class without feeling like I had improved my skills and learned how to better my work.

Now…

I am slowly working my way up to the higher level art classes and fulfilling requirements. I love planning, but I am honestly stressed out about what classes I will be able to take next semester. Many of them are inconveniently offered at the same time and conflict with other things in my schedule. Sophomores can usually apply to the BFA program during their Spring semester, but since I started the program later, I was unable to apply. I intend to apply to the VisComm program in the Spring of 2014.

As the semester comes to a close, I’ve realized how much better I feel in this major. Although it still has its difficulties, I feel much more in my element. The work can be hard and time consuming. There is fierce competition and stellar talent everywhere but none of that takes the fun out of it for me.

I’ve never related to this quote until now:

“Choose a job you love, and you will never have to work a day in your life.”

― Confucius

 What it Does

If you have a product that is distributed to more than one store nationally, you might well have been interested in a way to display retailers offering your product on a google map. That kind of display can offer a valuable visual hook for consumers, or for other retailers looking to add your product to their stores. If any of these aspects interest you, this plugin can help, and what is more, this map offers a range of options that can be customized to suit your needs:

• Add locations to a map of the United States
• Pick the states you would like to feature
• Link to your locations
• Select the colors of individual states

Reviews and New Uses

Now that the plugin has been launched, we are excited to begin receiving feedback from those using it in their sites. While we have certainly gotten use from it in our own sites, we are looking forward to seeing the new and creative ways others find to use the plugin. Say you wanted to designate regions with different ranges of your products, while also indicating every state in which your products are available—this plugin could help. Since you can customize each state’s color, you could easily set each region with a particular set of products to the same color—e.g., blue for all of those with the full range, red for those with a limited range—giving customers or potential clients a quick and easy way to see what is available and where. We look forward to even more applications of the plugin, as there are sure to be plenty we haven’t even thought of yet.

Giving Back

At Graphic Fusion, we are happy to get a chance to put something out there for the rest of the development community using WordPress. After getting so much from the platform, Chris and the rest of the development team were pleased that they had an opportunity to offer something of their own in turn. As new clients bring us new problems, we are sure to be developing new solutions. If any might make suitable plugins, we hope to make them available as well.

Regular fluid layout

The regular fluid layout can have multiple columns in it where width is set as a percentage.  If you need help setting this up there are many tutorials out there that cover this topic.

Fluid layout with fixed columns

What happens when we need to only have one column to be fluid and others with set widths like so?:

For a real world example where we used this set up:

The first 2 columns have set widths and the last column will dynamically change depending on the screen size.

How it’s done

The main problem is that you can’t just use width: auto and then float the elements to the left with fixed width. That approach won’t work (and will frustrate the hell out of you in the process). So here is our non-elegant workaround that, in fact, works wonderfully:

• Create a fluid element and give it a right margin big enough to fit the fixed width elements.
• Make the fixed elements and offset them by the same margin amount so they will fall into the empty spot next to our fluid column.
• Make everything float.

An illustration of how it will work:

Alternatively, we can force our fixed width columns into the open margin space with absolute position, but the height of the columns will not auto adjust with the fluid column height.

The Code

We will just show the css examples here:

#contentwrapper{
float: left;
width: 100%;
}

#fluid-column{
margin-right: 800px;   /*Set the right margin to (LeftColumnWidth + RightColumnWidth)*/
}

#column-one{
float: left;
width: 400px; /*Our fixed  width*/
margin-left: -800px; /*Set left margin to width of column + space for our 2 other blocks */
background: #C8FC98;
}

#column-two{
float: left;
width: 200px; 
margin-left: -400px; /*Width of our column + space for our other block*/
background: #FDE95E;
}
#column-three{
float: left;
width: 200px; 
margin-left: -200px; /*Width of our column*/
background: #FDE95E;
}

<span style="font-family: Georgia, 'Times New Roman', 'Bitstream Charter', Times, serif; font-size: 13px; line-height: 19px;">http://jsfiddle.net/yfkm3</span>

Also you can check out a live example of how it works on our Graphic Fusion home page 

Got questions or comments? Show us how you used it! This also works on all browsers even IE

Dependencies

First of all, jQuery needs to loaded on your page. I generally load it from Google, but you can also download jQuery and host it on your own server if you so choose. After jQuery is loaded on the page, you can then add the jquery.accordion.js file included in the download. You must also include the jquery.accordion.css file in order for the accordion to show and hide the correct sections.

Once everything is loaded, you need to set up the markup on your page to be compatible with accordions.

Markup

• First, you need a container with a class of “accordion-container” to contain all the sections of the particular accordion.
• Within the ”accordion-container”, you need to create a container with a class of “accordion” for each individual accordion section. To this, you also need to add either an “expanded” or “collapsed” class, depending on whether you want the accordion to default to expanded or collapsed.
• Next, within each accordion, there is an “accordion-header” section and an “accordion-content” section. The accordion header section is the part of the accordion that is always visible, and is generally the element you click to switch to a different setion. The accordion-content section has all the content that is revealed when a particular accordion is activated.
• Finally, you need to enable switching between accordion sections.  To enable switching between sections, you need to add ‘data-action=”accordion” ’ to the element you want to trigger the accordion. In most cases, I add this to the same div that has the class=”accordion-header”. This makes the entire header the trigger.

Example Markup

<div class=”accordion-container”>
	<div class=”accordion expanded”>
		<div class=”accordion-header”>Section 1</div>
		<div class=”accordion-content”>
			Content of this accordion goes here.
		</div>
	</div>
	<div class=”accordion collapsed”>
		<div class=”accordion-header”>Section 1</div>
		<div class=”accordion-content”>
			Content of this accordion goes here.
		</div>
	</div>
</div>

Advanced Usage

The example provided above is the most common way accordions are used, but there are other possibilities as well. In some instances,

There are other possibilities for how to trigger the different accordion sections. There is an example folder included in the download that has examples of a few different possibilities for how to use the accordion.

Resources

You can download a zip of all the files you need here

An online demo showing how this works is available here