Propel received an inquiry the other day via email. “How much is a logo?” they asked. I paused and asked myself, “How do I best answer this?”

Cost vs. Value.

In the creative-services business, pricing is a very difficult task. If Propel Group was in the business of manufacturing widgets, the task of estimating would be much easier—cost of goods, plus labor—simple. It’s not so easy in the business of design, advertising and web marketing.

Truthfully, to answer the question about costs, it depends on many variables. Time vs. more time, as it relates to the consensus building, revisions and approval processes as well as the market value placed on that time. Plus one’s ability to pay. For example, a small business can only afford X. Though corporate America can afford Z. If we applied a flat fee to our pricing structure then most likely the small business owner couldn’t afford to brand his/her start up business. And in contrast corporate America most likely wouldn’t place a value on it if we gave away brand development.

If we thought Propel could sell a logo for a flat fee, we would. It would sure simplify proposal writing. Is the company local, regional or national? Does it matter? Yes, it should because of the exposure. The marketplace increases it’s value. If we want to serve everyone from small businesses to corporations, then pricing naturally has to be flexible—which it is. So, admittedly we alter pricing for small business, corporations and non-profits to be available to serve the needs for each and all.

Are logos ever for free? No. Though if you know creative folks and what motivates them, you must know that, for example, a donut shop brand identity can get all kinds of creative juices flowing. And indeed, selfishly we want to do that work. Providing branding concepts for non-profits can be creatively rewarding, too. Helping the under-served motivates all of us. But that warm and fuzzy feeling doesn’t always allow our business to cover next week’s payroll responsibilities. Thus, why we pick and choose and limit what non-profits we serve.

Questions for questions.

So “how much?” they asked. Well, I wanted to ask, “How much is your brand worth? How much do you want to invest in your company’s image? Do you really think this can be done in an email?” But I knew these questions wouldn’t help us build a healthy agency-client relationship.

Decision makers.

Allow me to engage you to help me with the price of a company brand—let’s do the math together. The aforementioned donut store has one source of approval—definitely we will interface with the owner, the decision maker. Most likely, we will get good insight that enables us to hit the creative target quickly. We already know based on experiences, this will be an efficient in-and-out and yield good creative outcomes. Voilá. Easy. It is called profit.

On the other hand, large corporate clients often start with time-consuming RFPs well before introductions. Email exchanges; a proposal; hopefully, an initial meeting to discuss parameters. Will involve a sacrificial first round of creative to get folks to give you the input they didn’t have time to give because of cumbersome schedules. Then, more meetings; revisions; consensus-building; notes and more rescheduling to meet again. Typically, it can be an extremely drawn-out process and sometimes painful. Especially, if the meetings and revisions put things behind schedule or over budget. Even then, throughout the development process it is not unusual for the larger clients to experience some turnover. Unfortunately, in this economy it happens. A new set of client faces show up who weren’t involved in the initial process and ask again “How much does a logo cost?”

So, how much?

I can tell you first-hand that logos usually cost what brand identities should cost—whatever that is. Let’s talk. Let’s partner. Let’s brainstorm, and let’s at least have a donut or two over the value of your brand. Propel would welcome that.

Was contemplating a real challenge the other day—experiencing one day sans any electronics. Zip. Nada.

Can one really walk away from the mouse—from the cell phone, the iPad, the desktop? Could you really enjoy yourself for one day being cutoff from all handheld devices?

I think I want to try it for a day. I really mean solo—no television clickers either. Where’s my kindle?

For a change, I’d like to pick up a rod and reel. Do you ever wonder if the fish are biting? We just need to Google the lake’s fishing reports, right? Arrghh! Damn that mouse.

Admittedly, it may be hard. Seems we sit at the computer all day every day with a mouse in hand. Then we tend to go home at night and get on the computer or the iPad. Recently we were on a three day weekend vacation. I held the iPad more than I held my wife’s hand. We even walked down the street with the help of the GPS app in hand navigating our way. Coincidentally, we found the perfect blues bar in all of Chicago. There they held guitars and harmonicas, and special beverages, too—though not to digress.

I notice when we are around our kids they text nonstop. I even texted across the dinner table one night to get their reaction just to put it all in perspective. Funny, they even texted back a response.

To protest, like Peter Finch’s character did in the movie “Network”, I am ready to scream from the highest window—”I am tired of this mouse trap and I’m not going to take it anymore…”

Call it doing the Man thing! Beginners course, this Saturday for me. I am going to put the mouse down, turn off the cell and relax. Going to walk away and smell the roses, without my iPad, too. Am going to try and go solo though, not sure, it may feel like jumping out of an airplane without a parachute.

Life without Google—for a day. I can do it. Lol, who am I kidding. That dose of reality was scary stuff. Quickly back to work for me.

The technology curb impacts us all. Look at where we all were just 18
months ago with all forms of business marketing. The speed of change
forced upon business today admittedly is numbing. Even ourselves as a
company realize to compete you have to jump on board and brave uncharted
waters and embrace change.

Propel Group finds the demand for properly engineered websites superbly
optimized for the search engines is as great as ever. Clients have
learned to remain competitive they are thrust into the fast lane of an
ever changing landscape—bombarded with technology changes coming at them
at the speed of sound.

Rest assured Propel has embraced the technology curb. Armed with the
staff of genius to help clients meet the demands in this fast paced
environment, we have also embraced HTML5 technology which at its core
aims to improve the language with support for the latest multimedia
while keeping it easily readable by humans and consistently understood
by computers and all devices. Yes, it’s a complicated
thing—certainly—though the simplest methodology today in presenting all
forms of media content across the web for its users with all device
formats including improved smart phone and tablet users.

In all of this change, consequently, dated websites (even as much as 12
months old) are quickly becoming obsolete at a more rapid pace today.
Businesses find they must get onboard with change and move its marketing
efforts forward utilizing different HTML technologies. Simply, if you
fight it or ignore it you will left behind. Like the old saying about
roller coaster experiences—if you tense up and close your eyes, the ride
is far more stressful. Propel Group says throw your hands up, let’s go,
enjoy the ride.

Our best advice to you—keep your web content current, keep your content
accessible to all users, keep the technologies current—and keep a sense
of humor while keeping the change happening.

Propel Group recently completed a fun branding project for a unique donut store. The donuts are square and the shop is located in downtown Denton, just off the square. Hence the name, Denton Square Donuts. The client, directed by the landlord, contacted a local sign company to produce an exterior sign. A flat, lighted, can sign was their recommendation. The client naturally asked our opinion and unwilling to leave well enough alone, we suggested that a 3-D sign was in order.

A miniature version was built out of paper to get an idea of what that might look like. Without hesitation, that sign became what they wanted. Of course being a start-up, they had limited budgets. It is at this point of the story that the proverbial larger bite than one can chew was taken. You guessed it, I offered to build the sign for them. Those five years of working in a sign shop during my high school and early college years were going to be fully tested. The following is a pictorial catalog of the progress from start to finish.

Was it worth free donuts for life and a donut named after me? (Seriously, “The Darren” is delicious.) The joy on their face when the sign was installed and the sense of accomplishment knowing the right design was fully realized made it absolutely worth it. In fact, just this week I received an email from the client:

A guy just walked in…
“How’d you hear about the shop?”
“I was just driving by and saw the sign. That’s a really cool sign!”

Will I volunteer to do another anytime soon? Not likely.

The moral of this story — you never know how big of a bite Propel Group is willing to take unless you ask. For certain, the results are guaranteed to be sweet!

Speaking of sweet, there’s an app for that. No lie, they have an app that allows you to pre-order your donuts. And yes, our fingerprints are all over that as well. Check them out and make sure to “like” them on Facebook: Denton Square Donuts.

Working with quotes and blockquotes can be tricky when trying to decide the best way to implement consistent and contextual quotation marks. Below, we’ll explore how to hang the quotation marks outside of the text block. Note that the bold text has a quote element within the blockquote; this will come into play later.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse a nisi. Ut sed mauris eu nulla imperdiet egestas. Aliquam aliquet consequat sapien.

Duis suscipit consectetuer quam. Nulla sed est, “Proin urna nisl, ullamcorper a, scelerisque vel, accumsan in, arcu.” Suspendisse aliquet pede volutpat pede.

Nulla mauris dolor, consectetuer sit amet, varius nec, molestie sit amet, mi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.

Adding quotes.

We use the content attribute to generate quotes before and after our blockquote element.

blockquote:before{content:'\201C';}
blockquote:after{content:'\201D';}

“Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse a nisi. Ut sed mauris eu nulla imperdiet egestas. Aliquam aliquet consequat sapien.

Duis suscipit consectetuer quam. Nulla sed est, “Proin urna nisl, ullamcorper a, scelerisque vel, accumsan in, arcu.” Suspendisse aliquet pede volutpat pede.

Nulla mauris dolor, consectetuer sit amet, varius nec, molestie sit amet, mi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.”

Multi-paragraph quotes.

You might have noticed that we’re missing opening quotation marks on the second and third paragraphs. We can fix that by applying the dynamic content to the paragraphs inside the blockquote, instead of the blockquote itself.

blockquote p:before{content:'\201C';}
blockquote p:after{content:'';}
blockquote p:last-child:after{content:'\201D';}

“Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse a nisi. Ut sed mauris eu nulla imperdiet egestas. Aliquam aliquet consequat sapien.

“Duis suscipit consectetuer quam. Nulla sed est, “Proin urna nisl, ullamcorper a, scelerisque vel, accumsan in, arcu.” Suspendisse aliquet pede volutpat pede.

“Nulla mauris dolor, consectetuer sit amet, varius nec, molestie sit amet, mi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.”

Context-aware quotes.

Our problem now is that the quote element inside of our blockquote has double quotes as well, when they should be single. By using keywords instead of Unicode values, our quote element can change contextually. Note the change from double to single quotes in the bold sentence.

blockquote p:before{content:open-quote;}
blockquote p:after{content:no-close-quote;}
blockquote p:last-child:after{content:close-quote;}

“Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse a nisi. Ut sed mauris eu nulla imperdiet egestas. Aliquam aliquet consequat sapien.

“Duis suscipit consectetuer quam. Nulla sed est, ‘Proin urna nisl, ullamcorper a, scelerisque vel, accumsan in, arcu.’ Suspendisse aliquet pede volutpat pede.

“Nulla mauris dolor, consectetuer sit amet, varius nec, molestie sit amet, mi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.”

Specifying proper quotes.

The only problem with using keywords is that some browsers use improper marks—inch and foot marks. To get our curly quotes back, we’ll tell the blockquote element which Unicode characters to use. American-English quote patterns are used in this example; for other quotation marks, read the Localization section.

blockquote{quotes:'\201C' '\201D' '\2018' '\2019';}
blockquote p:before{content:open-quote;}
blockquote p:after{content:no-close-quote;}
blockquote p:last-child:after{content:close-quote;}

“Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse a nisi. Ut sed mauris eu nulla imperdiet egestas. Aliquam aliquet consequat sapien.

“Duis suscipit consectetuer quam. Nulla sed est, ‘Proin urna nisl, ullamcorper a, scelerisque vel, accumsan in, arcu.’ Suspendisse aliquet pede volutpat pede.

“Nulla mauris dolor, consectetuer sit amet, varius nec, molestie sit amet, mi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.”

Outsetting quote marks.

Now that we have proper, contextual quotation marks surrounding our blockquote paragraphs, a nice styling technique would be to outset them so that the text blocks are flush left. Note the position of the opening quote mark and first letter of each paragraph compared to the example above.

blockquote{quotes:'\201C' '\201D' '\2018' '\2019'; position:relative;}
blockquote p:before{content:open-quote; position:absolute; left:-.4em;}
blockquote p:after{content:no-close-quote;}
blockquote p:last-child:after{content:close-quote;}

“Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse a nisi. Ut sed mauris eu nulla imperdiet egestas. Aliquam aliquet consequat sapien.

“Duis suscipit consectetuer quam. Nulla sed est, ‘Proin urna nisl, ullamcorper a, scelerisque vel, accumsan in, arcu.’ Suspendisse aliquet pede volutpat pede.

“Nulla mauris dolor, consectetuer sit amet, varius nec, molestie sit amet, mi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.”

Localization (beta).

Since other languages use different quotation mark patterns and characters, this is one way to specify those differences.

blockquote{position:relative;}
blockquote:lang(en){quotes:'\201C' '\201D' '\2018' '\2019';}
blockquote:lang(en-GB){quotes:'\2018' '\2019' '\201C' '\201D';}

blockquote p:before{content:open-quote; position:absolute; left:-.4em;}
blockquote:lang(en) p:before{position:absolute; left:-.4em;}
blockquote:lang(en-GB) p:before{position:absolute; left:-.3em;}
blockquote p:after{content:no-close-quote;}
blockquote p:last-child:after{content:close-quote;}

‘Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse a nisi. Ut sed mauris eu nulla imperdiet egestas. Aliquam aliquet consequat sapien.

‘Duis suscipit consectetuer quam. Nulla sed est, “Proin urna nisl, ullamcorper a, scelerisque vel, accumsan in, arcu.” Suspendisse aliquet pede volutpat pede.

‘Nulla mauris dolor, consectetuer sit amet, varius nec, molestie sit amet, mi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.’

British-English version shown.

Large list of quotes for internationalization via CSS Tricks.

A QR code (abbreviated from Quick Response code) is a matrix barcode used for encoding information in a 2-d plane — like in the pages of brochures, flyers, t-shirts, magazines, and even on TV and websites. At its most basic, a QR code is a muscle-bound barcode that can used to send information to smart phones and tablets via their camera. QR codes are currently the best way to transmit information from the real world into an app-based device. Although initially used to track parts in vehicle manufacturing, QR codes are now used over a much wider range marketing applications.

How can your business benefit from the use of QR codes?

Propel can generate QR codes for your business that boost your marketing efforts. Let’s look at some ways QR codes can be implemented into your marketing strategy:

• Create a Vcard (will import contact info into the scanner’s phone)
• Create a meCard (like a simplified Vcard)
• Create a vCalendar event (import events into the scanner’s calendar program)
• Youtube URL for iPhone
• Browse to a website
• Bookmark a website
• Make a phone call
• Send an SMS (text)
• Send an Email
• Google Maps
• Encode the latest tweet of a user
• Tweet on Twitter
• or jut put in some text.

Recently had the chance to meet up with a large group of designers and developers from all over Texas (and further, in some cases). As often happens when geeks get together, there was a lot of discussion about what each person had and had not done. An interesting trend emerged from these conversations: at least presentationally, Dallas design firms (like Propel Group) are standing out ahead of the pack in many important ways. One thing that a lot of folks were amazed by that really stood out: responsive design with media queries. Lots of designers haven’t jumped on this yet, but it’s something we always do around here unless there’s a REALLY good reason not to.

OK, so what is responsive design?

Basically, responsive design just means making your website behave and look differently on different devices, orientations and screen sizes to get the best possible user experience regardless of how the site is viewed. There are many ways to go about it, but let’s just briefly go over mobile-up and desktop-down design patterns.

Mobile-Up Design

You’re on your phone. What do you generally want from a company’s website? Hours, contact info, a way to make an appointment, directions…that sort of thing. Maybe a menu or specials if it’s a restaurant. On the mobile, you really don’t need the entire history of the business, elaborate video content, etc., unless it’s mission-critical to the business itself. Move up into the tablet realm (vertical orientation — horizontal can pretty much use the desktop layout, by the way), and you’re starting to drill down into more detail and with a canvas that’s more than twice as large to work with. Finally, you get to the desktop and you can provide more information, a richer interface, and more visual “wow.”

Desktop-down Design

The idea here is that it’s easier to remove elements than add more. In many cases, that’s a good method. So, you build out your really great website and then take it down to vertical tablet level. You just lost a bunch of real estate, and you don’t want the whole site to just scale down and get hard to read. Time to do things like kick side-by-side elements into a vertical top-to-bottom orientation. Maybe reconfigure the giant multilevel menu into a tab-based system that slides down on a click. Then, go further down to mobile. Right back to the initial question in the mobile-down pattern: what’s actually the most important information that should be available anytime, anyplace? That’s your mobile content and the rest can go away if you don’t have a space for it.

Media Queries

All of the actual heavy lifting gets done here with media queries. If you’re not familiar, it’s basically the site telling the browser, “load this stylesheet if media = X and width = Y.” Same way you can set a print-only stylesheet that strips out navigation and unimportant graphics, you can have a stylesheet that only loads if the browser viewport is less than 480px wide, or whatever you choose. It’s a powerful tool, supported by pretty much all modern browsers (unsurprisingly, Internet Explorer 8 and lower don’t support it — but you’re using IE-specific stylesheets anyway, right? Good job).

Whether you’re designing from the mobile site up or the desktop site down, thinking about the limited loading speeds and decreased viewing timeframe of mobile use forces you to critically assess your content and decide what’s important and what’s expendable. And, for what it’s worth, responsive design is REALLY fun for your web designer. He or she will thank you, if you’re a client who walks in and asks for a responsively-designed fluid site. And isn’t keeping your designer happy the most important part?

We just strengthened our marriage of 37 years last week. The office had previously bought all the employees iPads. Which was a novel idea, until I got home and witnessed the spouse beginning to enjoy it as much as I did. I should mention at this juncture that she had received a Kindle last Christmas—and not once have I asked to borrow it.

As the jealousy began to develop, she would nag me over it. “When are you going to be done. I never get to use it,” she would say. Nor did it take long for her to remind me what was mine was hers until death do us part.

And then it became like an obsession. She would tell the kids that I was always hogging the iPad. Once she even likened it to me having an affair with it. I told her I was only having to work late, and that she was my first love—but she refused to believe it.

Then one morning she actually stole it out of my daytimer and held it back for her enjoyment while she was off that day. When I called to check on its whereabouts she had that evil chuckle as if she was expecting my call.

I admit I had begun to wonder how we would ever reconcile this matter. Then she had the brilliant idea to get her one, too. Of course she did and so we did. Used American Express points. Was on our threshold in three days—the same one she was carried over. Thank God.

Now the nagging has shifted to “I will share my apps if you share your apps.” The other night she even went so far to invite a friend over. Left them a voice mail that told them to bring their iPad along and we could share apps after dinner. Sounds like an after dinner AppParty to me. Seriously.

Today, granted, the persistent nagging has stopped. The opposite is true. Now we sit in total silence. Just as if we were on vacation enjoying a relaxing evening, both absorbed into a couple of great novels. The silence is usually broken when one of us asks the other “do you have my iPad charger?” The reply: “I do.”

My best advice to rekindle your romance with your significant other—simply get him or her an iPad. And live “Appily” ever after.

Yup, it’s another web tech article. If you’re considering a website build/redesign/update, you’ve probably heard a whole lot of acronyms thrown around. CSS3, HTML5, PHP, SEO, HTML5…but does it really matter? Why do you need to worry about this stuff?

In the case of HTML5, a lot of the details are, frankly, only interesting to web designers and developers. As much as the web department over here geeks out about things like new semantic element names and canvas elements, that’s all Greek to most folks. Doesn’t mean there aren’t a lot of excellent reasons you should DEMAND your new website be built up to HTML5 standards. Let’s just hit a few of them:

1. Video

   HTML5 includes a video element. If you have a website that includes video content that’s critically important, you should really consider using HTML5 as a delivery method. It’s pretty new on the landscape. There’s a lot of hoops to jump through to encode the video [x] way for this browser, and [y] way for that one, etc., but here’s the kicker:

   Odds are, your current video delivery method is Flash-based. If so, it doesn’t work on iPads, iPhones and the like. It doesn’t work in stock Android installations unless the user has downloaded and installed the (kind of buggy) Flash application. It won’t work in the default “Metro” UI on the upcoming Windows 8. You’re potentially crippling your site and severely limiting the ways that visitors can use your site. Just go ahead and toss in a Flash fallback for the browsers that can’t handle HTML5 video, and you’re on your way.

2. Forms

   HTML5 forms have all sorts of little tweaks and fun things that can really increase your user experience. For example: the ability to specify if a form field is for email addresses or URLs can make a HUGE difference for users on devices with virtual keyboards. The keyboard UI will see that ‘email’ designation, and throw up the keyboard with the @ symbol right there. The ‘url’ designation gives the keyboard with the “.com” button. It’s just a few seconds, but those few seconds might be the difference between super-happy visitor and annoyed visitor.

3. Data Storage

   Ever used a web app for scheduling something/reminders/tasks? Maybe Gmail on your phone? You’re using local storage. Storing data strings for use later – persistent,and available when the user returns. Pretty useful to have around, eh? Think about the possibilities, and the convenience it can offer your site’s visitors.

4. Compatibility

   If you’ve ever considered having a website, you probably know that Internet Explorer renders things differently than any other browser. And each version of IE renders differently than the previous version. There’s a snazzy little JavaScript thing called the HTML5 Shim that makes all non-HTML5 ready browsers just go ahead and read HTML5 correctly. So, it’s not like you’d need to budget in extra development time for browser compatibility with HTML5 – it’s pretty much a 30 second fix.

There’s no reason why your site shouldn’t take advantage of all the possible new tech available. Sure, there are some neat features that older browsers won’t be able to handle, but overall you can deliver a solid experience to everyone, and a bunch of additional bells and whistles to modern browsers as long as you keep the mission-critical stuff down to what’s compatible. Keep moving forward and stay ahead of the curve.

We’d like to thank all who submitted ideas for apps. Ultimately, most of you simply needed to be pointed to existing apps, but we enjoyed discussing them with you.

We’re currently pursuing a few apps for some current and potential clients and can’t wait to share the details with you at a later date.

While the contest has ended, we’re always open to new ideas and opportunities in app development. So if you’ve got an idea, get your app in gear and let us know!

Propel Group Team