Posted on

Recent Updates to Store Locator Plus 4.6.4

Store Locator Plus version 4.6.4 fixed the zoom settings, the plug-in tabs “save changes” and the back-end UI.

The change in the back end user interface will not be noticeable to most users. The naming of sections and tabs and settings now will use programmatic slugs instead of the plain text names. This allows the settings translations in different languages to remain intact even if language files have not been updated. This means future updates to Store Locator Plus, Power, Experience, and Premier add-ons will no longer lose their settings tabs. Another behind the scenes development is populating the plug-in and add-ons with “smart options” settings. To learn more please watch the developer’s brief You Tube.

Change Log for Store Locator Plus

Posted on

Tweaking A Locator Theme

Map Guys Drawing Banner

The following is an outline of the steps that were taken to tweak the Above All Rev 01 theme for the PACCC website running on the Genesis News Pro theme from Studio Press.    This shows how a few simple settings and minor CSS updates are made to get the locator to offer a better user interface for the site visitors.

User Experience / Search Form 

– Set the address label to blank.   We will use placeholders to instruct the users.
– Change the radius label to “Radius”.
– Change the Name placeholder to “Search by name”.
– Turn on “Show Search By Name”.
– Set Pro Pack Tag Input to none.
– Add this custom CSS rule to fix the radius input label.
#address_search #addy_in_radius {
    width: 17%;
}
This gets the site to this point:

There are already some Tagalong categories set.   With only a few categories for the locations I decided to use a single drop down display to allow users to select the category in that fashion.
– Set Show Categories on Search to “single” as the drop down style.
– Set the Category Select Label to “Type of Counseling:”
– Add this custom CSS rule to fix the radius input label.
#tagalong_category_selector #cat {
    width: 24em;
}
This gets you to this point on the site:

About Categorizing/Filtering Locations

This will work for the current site configuration.    If you want to do a dual-option filter for the locations as shown on the comparison site then I suggest using a combination of Pro Pack tags and Tagalong categories.
Use Tagalong for complex / many-options categories for the locations in  your system.     ALWAYS use Tagalong for any type of category structure where it makes sense to have parent categories with children.   Whenever I have parent/children category structures I change the Show Categories option under Tagalong to “Cascading”.   In the example provided this would be the array of 2-dozen services provided with things like “Marital” as a parent category and “Premarital, Divorce, Children” as the subcategory.
Use Pro Pack for the simple options/categories on the locations.     I use this whenever a location only has a few options that I want users to pick from as a second filter on the locations.     In the example provided this would be the “Male Counselor, Female Counselor, Online Counseling”.

If you are only going to have ONE filter/selection criteria on the locations I suggest ALWAYS using Tagalong.   Tagalong is structured data and has less chances for data entry errors.     It is easier to fix category problems if you have lots of locations.    Over time Tagalong categories will continue to get new features and functionality.

Posted on

USPTO Patent Filing System – A Lesson In Modern Web Design

USPTO Banner

I have been working on filing a provisional patent for the past 2 days.   I am not talking about writing the actual patent, that took over a week.   When I say I have been “working on filing” for 2 days I mean the actual “simple” process of filing the already completed patent via the USPTO online filing system.

The quaint USPTO’s web app is referred to as the “e Filing System”.    Remember when “e-Whatever” was cool?   That meant you were doing cool online stuff with the interwebs like “e-Commerce”.   Maybe it is still cool to refer to anything you do via the web as “e-Something” but I’m pretty sure nobody calls their website their “eStore” or their “eBrochure” these days.

And by “quaint” I mean outdated, non-functional, and generally useless.

Historical UI

Now I know the USPTO goes back a few years.   They started way back in 1871, just before Al Gore got his first computer and started designing the Internet.    Thus I can understand what they are trying to achieve with the user experience throughout the site.    They clearly want to mimic the classic look-and-feel of the original Internet to give the entire site that sort of “reminiscent of the good ol’ days” feel.

The horrific color scheme, complete lack of use of white space throughout the site,  pages with nothing but lists of links, and 37 menus per page are all great design patterns of the early Internet.    Sure it makes the site difficult as hell to navigate, but sometimes you need to trade usability for really great marketing and branding.

USPTO Modern UI Design
USPTO : Historical User Interface brings us back to the days of excess navigation, no white space, and small fonts.

I do think they missed some opportunities by leaving off the scrolling marquee.   I definitely saw a few places where blink text could add to the experience.   I am also fairly certain my browser is not setup properly because I did not see very many animated GIFs on the page either.   But hey, nobody is perfect.   I’m sure they will get those things implemented next week.

USPTO UI Consistency
USPTO also sets themselves apart by ensuring you don’t confuse the FAQ pages with the rest of the site.

Ultra Secure User Registration

Now, to get started with the USTO advanced electronic filing system they STRONGLY recommend you become a registered user.    With some forethought an ingenuity they actually made this a fairly simple process.    You start by filling out a Customer Number Request PDF file and FAXING it to the USPTO Electronic Business Center.

Once you have that you can then proceed to Obtain a Digital Certificate by downloading and executing the PKI Subscriber Agreement, completing the Certificate Action Form and then MAILING the original form (no faxes or copies) to the Commissioner for Patents.

I am really glad they did this.    I, for one, think it is WAY too easy for people to conduct business online.   If everyone that ran an online business would start requiring people to both FAX and MAIL (I’m talking Postal Mail, aka Snail Mail here… not that spam-infested email thing) documentation to obtain a login then we would ALL be better off.   Just think of how much less spam, phishing emails, and viruses there would be online if everyone was required to prove they were serious by going through this process.

Bravo USPTO on helping make the Internet a more secure place to conduct business.

Maybe NASA, the Armed Forces, and other branches of government will follow your lead and make their systems more secure when it comes to online transactions.  Lord knows their 100% online registration and access systems for government contractors attract the scum-of-the-internet like an infested wound attracts tsetse flies.

 

Thank you USPTO for being the first to show us that online registration is NOT for everyone.  If you can't put in the effort you shouldn't be online.
Thank you USPTO for being the first to show us that online registration is NOT for everyone. If you can’t put in the effort you shouldn’t be online.

 

Modern Java Form Fields

Luckily the USPTO has created an online filing system that is a little less historical than the UI design.    Their modern process moves beyond the early days of the web and brings us past the days of animated GIFs and fully into the World of Java apps.   Thankfully they saw the future of web applications and did not burden us with browsers that can’t handle things like filling out simple online web forms or uploading files.   Lord only knows that sort of thing NEVER works cross-browser.

Thankfully the USPTO site forces me to download the Java Runtime Engine plugin for my Chrome 35 and Firefox 29 browsers.  Heaven knows where I’d be surfing the web these days without having a full Java engine at my beck-and-call every time I needed to fill out a web form or update a file.    Thank you USPTO for having my back.

Standard PDF Support

Thank GOD they support standard PDF files.   You don’t know how many times I’ve been bitten by the hassle of dealing with NON-standard PDF files.   I mean, it is not like PDF file formats are a proprietary file standard or anything.   If everyone did this I definitely wouldn’t need to have those 37 different PDF readers on my system.   Phew, another good save USPTO!

Not to brush off the fact that they also support the modern .ZIP compressed files, mega tables (when normal tables just won’t do), and the ever-present etc submissions.   But hey, let’s face it standard PDF files are a big deal.

USPTO Standard PDF Files
Good thing the USPTO supports STANDARD PDF files. Those non-standard PDF files are a bitch.

Java Apps That Shine

OK, enough of the sarcastic wit.   In reality the USPTO does have one thing that is useful here.   They do allow the normal scum-of-the-Internet, people like me, to file a patent without having to fax and mail documents to become a registered user.   That is truly a good thing.   It allows me to gain access to the modern forms interface that would only be possible with a solid Java app like the one they have running on the site.

The beauty of the Java interface starts to shine right from the first form.    Things like required form fields marked with a asterisk, helpful information circle graphics with off-color backgrounds, and compression artifacts in inline graphics would not be possible with the basic forms system and CSS of vanilla HTML.    I don’t think the random mix of proper-case, uppercase, camel case, and mixed case would be possible – at least not without a TON of extra work – with standard HTML.    Just take a look at all this modern form interface elegance that could only be viable by standardizing on Java forms!

USPTO Java Elegance In UI
Interface design examples that could only be possible with a modern Java app. Look at those gorgeous info icons… only possible in Java!

Java Security

Add another bonus point for USPTO security.   Thankfully they have made sure that all form inputs are cleared whenever you go back to a previous form.    I’m not talking about using the back button on your browser here, we all know better than that, I mean baked RIGHT INTO THE APP.  How cool is that?   Fill out a form and miss on of the 39 steps including 12 hidden checkboxes and the form is automatically cleared for you to start over.   Don’t want to influence you with past answers, after all they were WRONG the first time you filled out the app.

I also like the fact that the tabs are completely locked down unless you are on that particular step of the process.   It is a huge security hole to allow people to just jump around all willy-nilly like and navigate to any part of the interface.     If you are on the step where you are supposed to be reviewing your documents that is ALL you should be doing.    It has been proven that people are easily distracting and being able to click a tab for a previous step only increases the likelihood of distraction.    Thankfully the USPTO prevents that and makes sure that no matter what tab you click you always are shown only the current page you are supposed to be on… often cleared of all the data you were entering just to ensure you start with a clear mind!

 

A Lesson In Usability

In all seriousness, I truly appreciate what the USPTO has done here.  It serves as a shining example of how to serve your customer base.    Next time you are about to embark on a new web interface design, PLEASE visit the USPTO site.    Pretend you are someone that is wanting to file a new patent and go through the process.    Take note at how easy the interface is to use, how many times the user starts cursing, pulling their hair out, and throwing their mouse across the room.    Or take the shortcut and try it on a tablet, which will definitely bring you to the final analysis a lot faster; I reckon within 3 minutes of doing so.

Then take a deep breath and think about your new project.    Think about all of the things you DID NOT do to your customer by avoiding all of the user experience elements the USPTO brought to the table.

Go back to your design and think… “how can I make it simpler”.

I know it is difficult to see a user experience that you’ve been working with through a “fresh set of eyes” , but take the time to do so.  Introduce new people to the experience and listen to their feedback.    I’ve been doing the same thing with my site and every time I go through the process I always find something that I realize “wow, that is a pain in the ass” and try to make it a better experience for the user.

At least I can take solace in knowing no matter how convoluted my user experience is on my site or in my products they are light years ahead of the multi-million-dollar EFS system the USPTO cobbled together.

But hey, they do recommend IE 4 and Netscape Navigator 4… maybe I should go back and test with the recommended browser versions.  Maybe I’m missing something!   Does anyone have a Windows ME computer I can borrow?

USPTO System Requirements
USPTO keeps things real with browser and OS support we can all afford to keep up with.
Posted on

Store Locator Plus Layout Control

Customer Sites A360 Banner

A number of requests have been coming in asking a similar question:

How do I get Store Locator Plus to look like THIS….

This is typically either a screen shot from a Store Locator Plus advanced theme or from a customer site.

Some of the customer sites will require fairly extensive CSS and page layout tweaks.   Making those awesome looking sites doesn’t come easy and usually isn’t rolled up in an exactly-perfect-just-right WordPress + Store Locator Plus theme.   Luckily the Store Locator Plus add-on packs make it very easy to tweak the plugin layout controls which gives your  web graphics design team all the tools they need to get it “just right”.  No code editing or inline hacks required.

Here is the summary of what you will need to get the job done:

If you want full layout control of the advanced themes you will need to get at least the Pro Pack.

To get the EXACT look of many of the SLP Advanced Themes you will want to add Enhanced Search and Enhanced Results at a minimum.
I recommend 4 add-on packs for full layout control:
– Pro Pack : general layout of the locator components
– Enhanced Search : fine-tuned layout over the search form
– Enhanced Map : fine-tuned layout of the map area
– Enhanced Results – fine-tuned layout of the search results area
You can get all 4 plus Taglong for adding location categories with icons and a map legend via The Experience package which gives you all of the User Experience options.