Reading this article about Android color apps for designers a few days ago, I discovered the awesome little ColorGuide app for Android.

ColorGuide screenshotColorGuide

Although very twitchy (i.e., you have to hold it almost impossibly steady to save the current palette without it changing), it’s fun tool for walking through a store or down a street and capturing color palettes off displays, clothes, packaging, buildings, you name it.

Point the camera at anything and you’ll see a 5-color palette displayed on the screen. Click the Menu button and you can save it to the gallery. That’s all it does; pretty simple.

The photo at right shows a sample live view and the generated palette below. Click the camera icon on the left to freeze the palette, then the Menu button to save it.

Real Colors

Real Colors exampleIf you need something a little more stable, try Real Colors.

Take a photo or choose one from your Gallery and Real Colors will generate a palette – see the image at right, it’s a photo I took.

You can edit the palette in HSB or RGB modes, export or share it, or (with the Pro version) create wallpaper for your device.

The Pro version is available for $3.99 and is worth it if you’re a professional designer. It will allow you to export palettes to Adobe Swatch Exchange files, plus it automatically generates palettes using color theory rules (complementary, analogous, monochromatic, triad, tetrad and split complementary).

I really like that it provides hex values for each color. Real Colors is a well-put-together app that I’ll be using a lot.

CSS inheritance chainBack last fall I started using normalize.css instead of the very popular HTML reset that came standard with my current theme framework of choice. I like it a lot and have stopped using resets completely. I’ve customized it to fit my project needs and prefer it to resets for a few reasons:

  • It doesn’t target every existing HTML element – only those that really need normalizing, according to the developer’s research in major browsers.
  • It keeps browser defaults that are useful and attempts to make them render more consistently across major browsers.
  • It works fine on IE6+. I currently support down to IE7 so this is nice.
  • It fixes some common browser bugs that resets normally don’t touch.
  • And the big one that makes me really love it: less clutter when debugging.

As an example of the last point, here’s the kind of thing you see with a reset in place, using Chrome Developer Tools to ‘Inspect Element’ (see image to the right). normalize.css doesn’t use many blanket rulesets that include a large number of selecters like resets do.

Here’s a nice overview of normalize.css from the developer Nicolas Gallagher.

Recently I had the opportunity to work with a favorite client on a private content section of his WordPress site targeting the real estate industry. While the amount of protected content is actually very small, there were some specific requirements/constraints for the registration process and membership management tools:

  • Dead simple account approval process that allows my client to vet new applicants quickly
  • Allows custom fields in the registration form
  • Has the ability to export the membership data to CSV, and import new member data
  • Robust enough for larger membership databases, 25,000+ members
  • The ability to email all members or groups of members about product updates and news

After trying a few membership plugins for WordPress and being less than happy with the lack of a built-in account approval process, we went another direction. I got a trial version of aMember Pro, standalone membership software that’s been around for years. At $179.95 it’s not the cheapest solution, but the more I tested it the more I was sure my client would approve – and he did.

aMember Setup

Setting up aMember took some time, but it was not terribly difficult. I did have to check in with tech support once or twice (they are fast and responsive, by the way), mostly about how to hide some sections in the registration form template related to payments and membership levels; we didn’t need them because there’s only one level and it’s free. Setting it to manually approve new members is straightforward – just tick a checkbox – and all system emails are editable.

Adding custom fields to the registration form also required a little tinkering in the template file to change the order of a few fields.

aMember is not pretty right out of the box, but it is quite ready for integrating with HTML and CSS styling. My client only needed to show one page from aMember – the registration form. Styling it to complement the WordPress site was very easy, and that was all that was required for this particular project.

The Registration Process

A potential member registers by clicking a link on my client’s New Members page. He or she is then taken to the aMember registration form, they fill it out and submit it, and they get a confirmation email that states that all applications are manually approved and they’ll be notified of the decision soon. My client also receives an email letting him know that there’s a new application in the pool.

Clicking a link in the email takes him to aMember’s admin site. After logging in he clicks on Not Approved Users to see who’s new there. He can quickly view an application – they need to verify company info per their terms of service – then approve/deny one or more new members. When they’re approved, they’ll get an email with their new login info (which they’ll use to login to WordPress with some help from a plugin I’ll talk about a little later).

One thing to note: there is no way to automatically email an applicant who’s not approved, but you can click their email address in the Not Approved Users table to be taken to an email form. Pasting a pre-written denial notice that uses aMember shortcodes is a quick way to handle denied applications and this was a small issue my client was willing to live with.

Controlling the Private Content

Now back to WordPress. We needed to have approved aMember members be able to login here and see protected content, which includes a marketing page and an order form. aMember offers a plugin for this, but after hunting around in the forums for a while I decided on the $67 commercial plugin amProtect because of the many recommendations for it.

This turned out to be very fortuitous for reasons I’ll go into in the last part of this post!

amProtect does the following:

  • Integrates aMember products (like a membership level) into WordPress
  • Allows you to protect content for each product (i.e. hide a page unless you have a membership of a certain level)
  • Protect specific parts of a page’s content instead of entire pages
  • Allows for drip content
  • Provides a login widget

amProtect was easy to install and set up. I used it to protect parts of two pages in WordPress in seconds and it worked perfectly.

The Last Piece of the Puzzle

Finally, we get to the Gravity Forms part. I love Gravity Forms, I’d recommend it for anything but the most basic of form needs. It’s $39 and worth every penny.

This is not technically part of the private content area setup, but it connects. Trust me.

We used GF to create the order form that lives on one of the private content pages. There’s a little bit of intro text that is viewable by any visitor, then we show the form for members registered through aMember.

Why we used GF:

  • Supports multi-page forms
  • Conditional content – specific content is displayed only when certain form inputs are chosen or filled in (GF has a subtle sliding animation for this using jQuery if you like)
  • Can hide the submit button until the TOS are agreed to via a checkbox
  • The ability to dynamically populate fields based on the logged-in user’s data
  • Looks nice out of the box, and CSS styling, where needed, was straightforward

GF has a very nice visual editor and setting up the 2-page form was pretty simple.

The Problem We Ran Into…

The problem came when the client requested we prefill a set of contact info fields based on the members’ aMember registration data.

Urk. We discovered that dynamically populating from the aMember database, which is totally separate from the WordPress one, was not going to work without some help. I contacted Ken Gary, the developer of amProtect (remember our plugin that allows aMember logins in WordPress?).

amProtect has the ability to dynamically populate fields from aMember in Contact Form 7, another popular WordPress form plugin. I told him my problem on a Friday morning, and we went back and forth with a few emails where he tried to give me some code snippets that would both pull in aMember data and also work with Gravity Forms’ syntax for dynamic population. No joy.

Ken seemed to be as intrigued by the problem as I was. He bought a copy of Gravity Forms and told me he’d be in touch.

Late that same night I got an email from Ken with a new version of amProtect – he’d spent part of the day revising his plugin to also pull in aMember fields in a way that Gravity Forms could understand. I installed it and went back into GF, and had no problems getting the contact info fields to populate with the user’s aMember registration data.

Ken Gary ROCKS. I highly recommend his amProtect plugin if you’re considering a WordPress/aMember site, plus he has a number of other aMember-related plugins available. I’m glad that our problem led to the opportunity for him to offer an upgraded plugin – having support for both Contact Form 7 and Gravity Forms is a big deal.

A Workable System

For this particular client’s requirements, the WordPress/aMember setup fit the bill well.

One of the reasons for the need to quickly approve/deny applicants manually comes from the client’s trade shows – it’s not uncommon for them to have several thousand registrations in a day, and aMember provided the simplest way for them to handle the influx while still maintaining control of the membership.

The ability to tie together aMember, WordPress and Gravity Forms is a big plus for this setup. I hope this post proves useful for you if you’re looking for info on building membership sites in WordPress. Let me know if it does.

I haven’t been posting much lately in my blog – mostly because I’ve been working hard to get a long-time personal project finished and out the door. Done!

Creative Register launched about 10 days ago and is now closing on 30 listings. CR is a directory for (and of) creative professionals living and working in Northern Colorado and Southern Wyoming in the following industries:

  • Web design/development
  • Graphic design
  • Video
  • Audio
  • Internet marketing
  • Social media
  • Writing
  • Interior design
  • CoWorking spaces

…and I’m perfectly willing to add more categories as appropriate.

My main goal right now is to build up the database – if you’re a creative pro in N. CO or S. WY and haven’t yet heard about CR, I’d really appreciate you paying a visit and signing up for a free account. Paid accounts get more perks and are very affordable, but there will always be free accounts.

Yesterday I cleaned up my Blackberry curve to get rid of the ‘insufficient memory’ error and moved all my images and videos to a new 16gb media card. It’s running much faster today and I installed the WordPress app.

This is being posted from my BB using WordPress. What a great app – even better than I expected.