How to vet a plugin for add on development

Without plugins, many projects in WordPress would never have been possible. Almost all developers develop add-ons to modify existing plugins to fit a client’s needs.

But how do we choose vendor plugins to develop add-ons for? What makes a plugin extensible? What makes it reliable?

These are the questions that prompted me to create a checklist for vetting plugins. The checklist starts at presales and goes to code reviewing.

This is the checklist I shared during this talk. I also received a lot of great input from other developers during the talk and was able to improve the checklist as a result.

Checklist for vetting a plugin for add-on development

Before Downloading or Purchasing

  1. Does it have a good support culture?
  2. Does it have add-ons developed by third party developers?
  3. Does it have a strong community?
  4. Do they have clear, easy on the eyes, documentation?
  5. Do they embrace open source?

After Activation: Administrator UX

  1. Does it use the WordPress UI?
    • If not, is the changed UI creating a significantly better UX?
  2. Does it use nags tastefully?
  3. Does it take up minimal space for upsells?
  4. Does it allow for exports of user generated data?
    • Ex: Form submissions.

After Activation: Database Usage

  1. Does it stick to WP’s built-in tables?
  2. If it creates new tables are they absolutely needed?
  3. Does it add just a handful of rows in the wp_options table?
  4. Is everything prefixed?
    • New tables, meta keys, option keys, CPT or Custom taxonomy slugs etc…

After Activation: Performance

  1. Load the site up with a bunch of dummy content. I use WP-CLI, or FakerPress. The dummy content is important because you’ll only be able to see performances issues with content stressing the code.
  2. Use a profiler such as Query Monitor
    • You can use your preferred profiler for this
      Debug bar, blackfire.io. Browser Dev tools for Client side stuff.
  3. Check the Query Monitor output for red.
  4. Check for slow SQL queries, failing HTTP requests, or long running JS scripts.

After Activation: Uninstallation

  1. Does it give you the option to remove it’s data from the DB and Uploads directory? (credit to Brent Jett from the Beaver Builder Team)

Code Review: Clean Code

  1. Is it readable/easy to follow?
  2. Does it follow PHP and WP standards?

Code Review: Can you add Functionality?

  1. Grep do_action and apply_filters Are there a lot of them and are they all well documented in the code with a doc block?
  2. Does it provide a lot of actions?
  3. Does it allow you to filter data before saving?
  4. Does it allow you to filter data before it is output?

Code Review: Can you remove functionality?

  1. Does it use the hook pattern internally?
  2. Are the callbacks it adds to WP accessible?
    • Use Global Vars, static methods or Singletons.
      Bottom Line: Callbacks need to be accessible in some way.

Code Review: ShortCodes

  1. Does it allow you to filter the user input for shortcode attrs?
  2. Does it allow you to filter the allowable shortcode attrs?
  3. Does it allow you to filter shortcode HTML output?

Code Review: Internal API

  1. Does it have an internal API to access core functionality?
    • Check out WooCommerce (pre 3.0).

Code Review: Display Logic

  1. Does it have overridable templates?
  2. Does it enqueue scripts and styles?
  3. Does it use WordPress’ loop logic to output content?

Examples of good plugin design

  1. Gravity Forms- has a ton of filters to change submission data.
  2. WooCommerce- Overridable templates, great internal API.
  3. Beaver Builder- Best overridable Admin templates for module settings pages. Amazing communities of users and add-on developers.
  4. Ninja Forms- Breaks the rule about Admin UI design and greatly improves form creation UX as a result. An amazing community of add-on developers.
  5. Contact Form 7- really beautifully clean code, solid yet minimal plugin design, and amazingly extensible. Is symbolic of open source.
  6. CMB2- Great Developer’s meta box plugin

Slides


Useful Sources

Database Usage

  1. Which tables to use for what data
  2. What are the WP DB tables
  3. Problems with the options table
  4. Meta key best practices
  5. How to use post meta correctly
  6. How post meta gets abused
  7. A profiler for PHP, js, and mysql queries
  8. Versioning options arrays

Clean code

  1. PHP coding standards
  2. WP Coding standards
  3. Code mistakes in plugins
  4. Clean code in plugins
  5. Clean code in plugins
  6. File management in plugins

Can you remove functionality?

  1. Problems with not extensible plugins
  2. Orphan objects
  3. How to instantiate an accessible plugin

Display logic

  1. Overridable templates, filtered shortcodes and more

Admin UI

  1. Why use WP’s built in UI

User Experience in the Real World

Presentation by Clark Wimberly

Links/slides from presentation here: http://clarklab.com/talks/user-experience

Pros and cons of common UX blunders

What is UX?

  • What a user experiences
  • study of rules
  • guiding emotions
  • worth their time

UI vs UX

  • UI = User interface – what the user interacts with. Buttons, etc.
  • User Experience – how the interface makes them feel
  • Married but not the same

Paywalls – generally a bad user experience

  • Pros:
    • Registered user
    • who can we spam
  • Cons:
    • another registration for a user
    • they can spam me
  • Business goals can go against user experience
  • Can cause users to leave

Having a page with a slideshow/multiple pages/lots of content to click through

  • Pros:
    • pageviews
  • Cons
    • no one likes clicking
    • users won’t see content
    • harder to author
  • Solutions:
    • Don’t do it
    • View as one page
    • if you want page views, force reload
    • Lazy load plugins to help with bandwidth-heavy sites
    • Sub-navigation/table of contents – can work, but make sure it’s apparent what it is

Social lockers

  • Idea: hold desirable content hostage for likes, subscriptions, etc.
  • Pros:
    • Fans! Followers
  • Cons:
    • Annoying
    • Look like an awkward shill
    • Hit and runs
  • Solutions:
    • Generate value with social
    • Interact with followers
    • Treat it like a subscription service
    • share with @mentions and #hashtags and +names
    • Look for organic activity
    • Keep social interesting and then market to them… don’t market 100% of the time
    • If you use a lot of hashtags you’re probably doing it wrong

Newsletters

Idea: get a bunch of emails and get inside their inbox

  • Pros:
    • Pageviews! Opens!
    • Connect with fans – Great way to give fans an inside scoop
  • Cons:
    • Possibly annoying
    • Look like an awkward shill
    • Breaking the law if you do it wrong
  • Solutions:
    • Be useful
    • Easy to unsubscribe
    • Respect method of email collection
    • Don’t buy lists (or sell, or transfer)
    • Use the email list for what you tell subscribers it’s for – don’t change it up on them
    • Build trust and you might get whitelisted

Accessibility

Idea: make sure that everyone that wants to use your website can. Can be both dealing with physical impairments, but also can mean devices

Responsive design

  • Solutions
    • Use a responsive theme
    • Use a responsive plugin (Jetpack)
    • If neither of those are an option, at least make sure your desktop site isn’t broken so the site can be zoomed in and out, avoids flash
  • Gotchas
    • Readability
    • Image/page weight
    • Performance

Storyboards

  • Visualize the customer/user experience
  • Pros
    • You can get in the user’s head
    • Optimize the flow
    • Concrete goals for planning and arguments
  • Cons
    • Hard truths – learn what doesn’t work
    • Takes time
  • Go nuts
    • Hyper optimize steps
    • Google analytics goals at key steps
    • Make storyboard-based decisions

Personas

  • Who’s using the site
    • Age
    • Gender
    • Interests
    • Skills

Guerilla testing

  • Over the shoulder testing – just watch people use your site
  • Sentiment testing – which of these versions do you trust, find easiest, etc.
  • Drunk user testing – actually watch people test a site when they’ve been drinking. Drops their guard, scattered
  • usertesting.com
  • peek.usertesting.com
  • verifyapp.com

Tools of the attack

  • Analytics (Google, Jetpack, others)
  • InVision
  • UXPin
  • Balsamiq – wireframing
  • Mockingbird – wireframing in the browser
  • Omnigraffle

Doggie bag – what you’re leaving with tonight

  • Think of the user
  • Think ahead of the user
  • React to the user