One of the most popular requests we get for Commerce is for a free trial period for subscriptions. We've heard from many clients that wish to allow their members a free, or reduced cost trial period before auto-renewing the full price.
I'm pleased to say that we've now added this functionality into Invision Community 4.5. Let us take a look at how it works.
In 4.5 you can now specify an initial term that is different to the normal renewal term for any subscription plan or product. For example, you could make the initial term $0 for 1 week and the normal renewal term $10 per month which will allow you to create 1 week free trial. The initial term doesn't have to be $0, you can use any special price for the initial term you like.
For developers creating their own applications with Commerce integration, this functionality is also available to you simply by passing a DateInterval object representing the initial term when creating the invoice.
Previously, if you were buying something that is free, the entire of the last step of the checkout would just be skipped and the invoice marked as paid.
In 4.5, if:
- The user is purchasing something which has a free initial period, but also has a renewal term (i.e. is a free trial), and
- You have a payment method which can collect card details (Stripe, Braintree, etc)
The user will be prompted to provide payment details that will not be charged until after the free trial. If the user already has a card on file they will not be prompted to provide the details again but will see a confirmation screen rather than the order just being marked paid immediately.
As you can see, allowing a free or reduced cost trial period has never been easier. We hope that you enjoy using this new feature of Invision Community 4.5.
We started talking about Invision Community 4.5 way back in November of last year. Now, less than six months later, it's ready for you to test.
While we put the finishing touches to a few features, we have set up a preview site so you can test out the new features, leave your feedback and make a note of any bugs you spot.
Head over now to the Invision Community Alpha test site.
Please be aware that this test site is running in 'development mode' so it is automatically updated with the latest fixes throughout the day. This means it has to work extra hard on each click as there are no caches, pre-built languages or templates to use, so it will be a lot slower than a production version. So please don't worry about it being a touch slow, and definitely don't try and run Page Speed analysis tools on the alpha site!
You can read about the headline features over in our product updates blog.
Let us know what you think!
We have announced a lot of new things coming soon with Invision Community 4.5. Most of these are pretty big new features worth a blog on their own.
However, we've made a lot of smaller changes that may not deserve their own blog but still have a significant impact.
Let's run through some of those.
For every major release, we take some time to run through the code and look at ways to make Invision Community run more efficiently.
For Invision Community 4.5, we've made node forms, sitemaps and commonly run SQL queries more efficient, which is excellent news for you and your users who get reduced server load and a snappier community.
Although it confuses me greatly, TikTok has taken the internet by storm. We have added it to the embed list so pasting a TikTok share link automatically shows the video ready to play in the comment.
Uploading large files can be tricky. Typically trying to push a large file to a server results in timeouts, memory issues and eventually frustration. We have added chunked uploading when using S3. Put simply; this uploads part of the file at a time to prevent memory issues and the server timing out waiting for the upload to finish.
View Members by Rank
Very recently, we were asked how you can view all members in the ACP of a specific rank. It turned out you couldn't. This quick change was added into Invision Community 4.5.
While Invision Community 4.5 has new and improved statistic displays, a common request was to be able to download the raw data. This is now possible.
Export stats as a CSV
In Invision Community 4.5, when you require approval of new versions of files submitted to Downloads, the original version will no longer be hidden from view. We've added a new flow for moderators to approve these new versions.
Live Meta Tag Editor
Invision Community 4.5 seemed like a great time to run through this feature and tweak the functionality to make it more useful. Now it's possible to remove default meta tags, and it's easier to remove custom tags.
Closed Tag Autocomplete
When using the closed tag system where a user can select from one of your preset tags, we have added a search box to make it easier to find a single tag from a list of potentially hundreds.
EU Tax Support in Commerce
Tax doesn't have to be taxing! But it generally is. Countries within the EU often have complex tax rates. Commerce now supports multiple tax rates for consumers, businesses and EU VAT-registered businesses.
That concludes our mini round-up of all the things we've not talked about yet. Let me know which one you're looking forward to most!
Ever since Invision Community 4.0, there has been a huge focus on making communities multi-lingual by providing translation features inside the AdminCP.
We have received a lot of feedback on our multi-lingual and translation tools over the past year, and we're happy to announce these new features coming to Invision Community 4.5.
Pages Phrase Tools
If you have the Pages application, you can also use these phrases in HTML pages and HTML Blocks without needing to visit the translation tools area. Simply use the tag editor in the sidebar when editing a page or block's contents.
The new phrases sidebar options
You can quickly create new multi-lingual phrases by clicking the + icon.
Additionally, WYSIWYG Blocks have now been made translatable, so you can now create WYSIWYG blocks that will display their content in specific languages.
Language pack creators can now set a version update URL which is checked to notify admins within the AdminCP that an update available, just like the theme system. This is a great way to notify customers when fixes are available.
Finally, you can now quickly add a new phrase from the Translation Tools page without the need to use the developer tools.
These little changes should make a huge difference in your workflow, and make it easier than ever to create fully multi-lingual pages throughout your site.
If you've been around Invision Community for a while, you'll know our frontend default theme hasn't significantly evolved since the early days of 4.0. Indeed, the last significant refresh came with 4.2.
With the upcoming release of 4.5, we wanted to revisit the default theme and give it a facelift for 2020, as well as make incremental improvements to the underlying codebase as a stepping stone to a bigger re-engineering in a future version.
In this entry, I want to talk a little about some of the design decisions that went into building the new theme.
Redesigning for the sake of it is never a good idea, so we first laid out what we wanted to achieve:
- A brighter UI with more saturation & contrast and simpler overall color scheme
- Improved typography
- Better, more consistent, spacing around and between elements, especially on mobile
- Better logical grouping of sections of each page
- Reducing underutilized links/buttons on the page and finding alternative ways of making them available
- Improving how post states are displayed
- Modernizing and enhancing the underlying code that powers the default theme
Let's talk a little about each of these.
The most obvious change will be that our default colors are brighter and more saturated than before. Before making any changes, we first created a color scale for both neutrals and the brand color (blue, of course). This gave us a flexible but consistent palette of colors to choose from, with appropriate contrast built in. Neutrals have a touch of blue too to avoid seeming washed out.
We've simplified the style, in particular reducing reliance on background colors to differentiate sections within cards (a card essentially being an ipsBox, for those who are familiar with our framework). Instead, we use spacing, borders and appropriate typography to achieve visual separation.
We've felt our typography has been somewhat muddled for some time - with a mixture of sizes, weights and colors used depending on the particular context.
The first step to improving it was to create a typography scale that we could refer to and implement, to ensure we remained consistent throughout the product.
(The keen-eyed amongst you may also notice we've switched our default font to Inter. Inter is a fantastic open source font that is ideal for text on the web, and was recently added to the Google Web Fonts project making it super simple for us to incorporate it into our default theme.)
We've been much more deliberate about applying type styles, especially for titles, ensuring that they are always visually distinct from surrounding text. We've done this through both color and weight. As a result, pages should instinctively feel more organized and logical than before.
An example of improved typography, from the Downloads app
Improved spacing (especially on mobile)
We identified that spacing (padding and margins) needed some improvement. A lot of spacing values were arbitrary and inconsistent, leading to poor visual harmony across any given page.
Most troubling of all, on mobile sizes we simply halved desktop padding values. While this was a reasonable approach in the days of phones with small screens, it has felt decidedly dated for some time. Phone screens are now typically larger and able to accommodate roomier UIs without appearing comical.
In 4.5, we have done away with that approach, and the impact was immediate. Mobile sizes now get a much more pleasant interface, with elements having room to breathe. In addition, we've also made most cards full-width to provide additional breathing space for content.
Posts can finally breathe on mobile
There are numerous other tweaks across the product too: default spacing has been increased a little, data tables (e.g. topic listing) get extra vertical spacing, and spacing between elements has become more consistent.
Improved grouping of related elements
Prior to 4.5, most content areas existed inside cards. However, one notable exception to this was page headers and as a result, they could feel particularly disorganized, especially for users who had many controls in this part of the page (such as staff).
To solve this problem, we've developed a new, standardized design for content item page headers, giving them their own cards and consistent button placement.
Topic view header
Some areas don't necessarily fit into the same design pattern above. In those areas, we've tweaked styling to suit the context, while still adhering to our overall aesthetic.
Messenger conversation header
Reducing underutilized links/buttons
Finally, another area we identified as needing improvement is the abundance of tools, made up of links and buttons, across pages. Many of these are only used occasionally and so would be better moved out of the main view to simplify the page.
Two particular areas we focused on were share links and postbits (both forum posts and comments in other apps).
Research shows social share links are used by a vanishingly small percentage of users, so even though they were at the bottom of the page, it was unnecessary to make them so prominent (given their eye-catching colors). To solve this, we've added a share link to the page header, with the social network links themselves in a popup menu. The result is ideal: sharing functionality is unobtrusive but obvious.
Share links in content items
Comment areas have also suffered from 'button creep' over the years. A typical comment will contain a report link, a share link, a quote link and multiquote button, reactions, plus IP address, checkbox, edit and options links for certain users. That is a lot of visual noise around the important part: the content.
We've therefore simplified comment boxes as much as is reasonable. Reporting and sharing comments/posts is now available in the post options menu, as are any tools for the author/staff. Quoting and reacting are two primary interactions for users, so they of course retain their position in the control bar.
Simpler postbits, even for staff
Improving post states
Posts/comments in Invision Community can have many states - sometimes more than one. Posts can be hidden/unapproved, popular, recommended, solved (new in 4.5!) or highlighted because of the author's group. It's always been a challenge to indicate these statuses well.
In previous versions, we added a border but the most prominent indicator was a flag in the top-right corner of the post. This had three problems:
- Due to the lack of space (thanks to report/share links), showing more than one flag was difficult.
- Showing any flags on mobile was messy because of the space constraints.
- The meaning of the flags was not obvious, especially to new users. Group-highlighted posts had no flag, just a border, which made them even more difficult to understand.
With the top-right corner of posts now tidied up and free from fluff, we were able to much more effectively use this space to indicate post statuses.
In 4.5, posts and comments will show badges when they have a particular status, as well as a more attractive semi-transparent border. For group-highlighted posts, we show the group name instead (the colors of this highlight are still controllable via theme settings).
This works much better on mobile too, where the status badges get the prominence they deserve:
Mobile post statuses
Modernizing the underlying code
I wrote about the technical improvements behind the theme in a previous entry. If you're a theme designer or edit the theme for your own community, go and check it out now!
As well as these large-scale concepts, you'll notice many other smaller enhancements as you start using the new theme.
I've shown some snippets of pages in the screenshots above, but I've included some full-page views below so you can see the overall aesthetic and how these pieces fit together.
Modernizing and refreshing our default theme has been needed for some time, but we view this as just a stepping stone to future work that will be reserved for a major version bump, and we're excited to figure out where we go next.
Who's Online 23 all people including: 0 Members, 0 Anonymous, 23 Guests (See full list)