Claudia999

As showcased in our past blogs, Invision Community 5 introduces a brand new, modern interface which brings improvements to performance, aesthetics and mobile usability.
An optional side navigation panel, new view modes, light/dark modes, customizable header layouts, a search modal and a mobile navigation bar are some of the things we've showcased previously. Today, lets take a closer look at some other miscellaneous changes that we've been working on while developing Version 5, including some of the code reductions and performance improvements that we've been able to achieve in the process.
For those of you who are developers, we'll also give some simple explanations of how (and why) we've implemented these changes.
 
Widgets
Sidebar widgets are perfect for displaying content feeds, featured members, announcements, advertisements and more on your page. In version 4 however, the widget column would often become an empty space once the widgets had been scrolled past:
  widgets-v4.mp4  
In version 5, widgets now stick to the screen once the last widget has been reached, ensuring your readers have more convenient  access to your widgets rather than a void space:
  sticky-widgets-v5.mp4  
 
Messenger
The Messenger is a great way to reach out to members when a private chat is more appropriate than a topic. Inspired by modern email clients, the messenger in Version 5 has been revamped with a full-height, sticky inbox, a longer message snippet, mini profiles and a more polished UI - all with a 25% reduction in CSS and a 100% reduction in Javascript.
messenger-v5.mp4
 
Sticky elements
We've mentioned sticky elements a couple of times now, so lets take a look behind the scenes at how they're created, and some of the performance improvements with Version 5. Traditionally, sticky elements were created using Javascript which would calculate the position of the element on the page and adjust it's stickiness every time the page was scrolled. Scroll events can be quite taxing for browsers, and when it comes to Javascript, the less, the better (especially when aiming for great page speed scores)!
With that in mind, all sticky elements are now handled using sticky positioning via CSS, which is a native and much more performant way of controlling these elements. We've been able to replace an entire 400 line Javascript component with just 3 lines of CSS.
 
Grids and Masonry
Grids have previously been handled in a similar fashion. Javascript would scan all elements within a grid to determine how many could fit on a single line, and would then shuffle these elements into position after the page was loaded or resized. CSS has since introduced its own grid properties, which has allowed us to replace more than 350 lines of Javascript with just a few lines of CSS, resulting in more performant page rendering and nicer looking grids (especially on small-medium displays such as mobiles and tablets).
 

 
Fun fact: We first introduced a similar performance improvement to "masonry grids" in our Gallery update from January this year, by replacing more than 400 lines of Javascript with, you guessed it, just a few lines of CSS.
 

 
 
 
Click targets
We wanted to make Version 5 as simple as possible to navigate, and one way of doing that has been by implementing larger click targets. Clicking anywhere inside an entry in a table or grid will now take you to that entry (you can still click on other links like normal within the click target, such as subforums or profile links). Click targets are optional and can be disabled via your theme settings if necessary.
 
click-targets.mp4
 
Data Lists (tables)
Speaking of tables, they too have been revamped. Tables automatically adapt to the space they've been assigned to (for those curious, this is done using CSS container-queries), so they're always neat regardless of the screen size, with no overflow or squashed layouts. Behind the scenes, the two columns below are created with identical code, yet they're quite different visually due to the size which they've been allocated. Even with these improvements, tables have received a 25% reduction in CSS.
 

 
Profiles
Profiles have been polished for Version 5 and include some nice improvements such as sticky widgets and tabs. 
profile-desktop.mp4
 
On mobiles, the side column collapses into a carousel, and the sticky tabs allow you to easily flick between content types without scrolling to the top of the page.
profile-mobile.mp4
 

Tabs
You may have noticed in the above clip that tabs on mobiles are now scrollable, compared to a dropdown menu from version 4. We made this change to ensure that tabs are given more equal exposure on small devices, and have managed to reduce the CSS by a whopping 80%.
 
Carousels
Last and certainly not least, are carousels. Carousels are great for displaying large amounts of data in a confined space and they've been rewritten from scratch for version 5. Previously, a Javascript library was used to create the "scroll effect", however this has never been the smoothest experience on laptop trackpads and touch devices.
In version 5, carousels are powered by native smooth-scrolling and scroll-snapping, which results in a much nicer user experience, especially on touchscreens. We've been able to remove a staggering 95% of the Javascript, substituting it with just a few lines of CSS.
 
carousel.mp4
 
To be honest, we've only just scratched the surface here! In addition to these changes, we've modernized (and reduced code) in almost every component throughout the suite including avatars, cover photos, dropdown menus, forms, inputs, buttons, lists, off-canvas menus, side menus, columns and more!
Combined, these changes result in not only a significant reduction in code, but also a polished UI that performs smoothly on desktop and touch devices. We're excited to continue modernizing Invision Community well into the future as new technologies and techniques become available to us, and are looking forward to getting it in your hands in 2024.

Whether you have hours to browse a community or are short on time, scrolling through a very long topic can be more than a little frustrating when you want to follow the topic's core journey.
Recently, we discussed another feature designed to help support-based communities find helpful answers quickly, but what about social topics that do not have a simple question-and-answer format?
We've all come to a lengthy topic for the first time and found it a little intimidating to find the most relevant content among hundreds of posts, which don't always further the topic. These off-topic posts are important because they help social cohesion and build relationships between members at the time of posting. Still, those visiting later often want the truth of the topic.
Invision Community 5 brings a topic summary feature designed to make the most of your time.

The topic summary is generated by an algorithm that uses many touch points such as average read times, reactions, number of shares, external linking and more to determine how useful a post is via a numeric ranking.
The summary shows an estimated read time of the entire topic and an estimated read time using the summary, which gives your members a good idea of the time they'll save.
A shorter read time will make longer topics more accessible to a greater audience.

Adjusting the summary
We believe that algorithms should be used to support human decisions but not override them. Those with permission can add posts from the summary if they feel they are more relevant. Likewise, posts can be removed if you think they are irrelevant.

Interactions with Helpful Posts
Invision Community supports a broad range of communities, including support-based and social communities. We are improving our toolset to help both.
You can have helpful post-voting enabled as well as topic summaries enabled. When this is the case, the topic summary will show until the helpful post-voting meets a threshold. Once that threshold is met, the helpful post information will replace it.
Of course, not all communities and not every forum will have the support features enabled, meaning the topic summary will be the only way to reduce the topic complexity.
Less is more
Browsing the summary gives you a concise view of the topic's journey with no distractions, a vital strategy for growth. 
By allowing members to focus on the core journey, you reward the time they spend on your community and make it more accessible for those short on time.
We hope you've enjoyed this feature introduction and would love to hear your thoughts!
a.ipsAttachLink img { margin: 18px 0px 18px 0px;}

Bringing your community together with both online and in-person events is one of the most powerful ways to create meaningful connections, long-lasting relationships and one-of-a-kind experiences. 
The pandemic put a stop to many in-person events, but now that the dust is settling and people are beginning to return to some sense of normalcy, physical events are becoming commonplace. However, we can’t ignore the recent surge in online events now that COVID inspired a new norm. 
Previously, the Calendar application acted as more of a personal planner, focusing on daily, weekly, monthly and yearly happenings. That functionality still exists, but we’ll leave it to Google Calendar and the likes to handle your standard appointments. 
Instead, we’re shifting focus to community-driven events with our appropriately named app, Events, available for all Invision Community clients. 
Our Events app features a beautiful overview page that showcases community events.
Let’s take a closer look: 
 
Featured Events
calendar.mp4

Community leaders can now promote member-driven events with the “Feature” option. This highlights the event on the main overview page for all to see. It includes the event’s cover photo, date, title and description.
 
Search Events


 
Search for community events that are located near you. 
Tapping the “use my location” prompt allows your browser to identify your physical location, then shows a list of events that are in close proximity to you. 
Get granular with your search. Filter by general  location, date and/or whether the event is an in-person or online event. 

Maps

 
When searching, a map is also available for you to see in an instant what community events are happening.

Happening Near You


This section shows a list of events happening near you. It includes a snap shot of the events happening near your physical location, as well as a map of where the event is taking place.
This tailor-made page displays events based on geo-location, so communities with members from all over the world will view and experience the Events page differently. 
If there aren’t any events happening, a message block is displayed instead that says: 
 
Happening Today
 


On the day of, your event will include a badge to show the entire community the special event is happening.

Online Events


 
This section displays a list of virtual events within your community. Events are shown in chronological order by date and time.

Browse by month


 
We extended the search functionality to automatically show both in-person and online events categorized by the month. 
This is particularly useful to plan what events you’d like to attend and also see what’s in the pipeline. 
 
Event Page

Here's an example of what an Event's page looks like. It includes the event details, a map if it's an in-person event and an “Open Event” linked button for the online events. Optionally members can RSVP or confirm they attended when you request that per event.

Integrations
A particularly useful addition to our new Events application is the inclusion of popular, third-party video streaming platforms. When creating a virtual event in your Events application, you may include a link to your event and the platform will advertise it with the vendor’s logo so your community knows what to expect. When your members are ready to join, choosing the “Open Event” button will set them on their way.

Below is a complete list of platforms that Invision Community’s Events app can showcase (see examples in the screen shots above):
Zoom YouTube EventBrite On24 Facebook Google Webex Slack Discord Microsoft Teams
Here are a few examples of how your community can leverage our Events with in-person events:
Team building meeting
Unite your team with a collaborative event celebrating the company’s wins and victories. Sometimes in-person meetings spark new ideas in ways that a virtual environment can’t. 
Donation drive
Round up your local community and raise money for those in need with an in-person fundraiser. 
Training programs
Gather a group of community moderators and/or employees together and teach them how to innovate, strategize and lead with a physical training event. 
Flash sale
Make Black Friday, Boxing Day and other major retail sales an event within your community. Encourage your community to show up to a limited-time flash sale where in-person purchases are the only route to obtain an exclusive item. 
 
Let's check out some examples for online events:
Virtual happy hour
Let loose with a few of your community buddies at a virtual happy hour. Schedule something once a week or month and make a few extra friends no matter where they live (a cold brew at 5 a.m. your time when it’s 5 p.m. their time might be a tad awkward, but hey, it’s 5 p.m. somewhere). 
Holiday party
If your company is remote-based, an online holiday party is the perfect solution to spread the good time vibes. 
Interviews
Invite fans of an artist to watch a virtual live stream or music video where they can actively engage and contribute.
Fan gatherings
Speaking of fans or an artist or brand, unite people who share common interests together with a fan-fueled event. Conduct a Q&A, share inside information and create a space for them to celebrate their collective passions.
 
Our Events application is a welcomed addition designed to bring an enhanced presentation of the events happening in your space both on and offline. Community users can enjoy this interactive overview as an add-on to the traditional view. As a site admin, the overview page can be set as the new default in your AdminCP.
We are excited to bring the Events application to all Invision Community plans in an upcoming release.
Let us know what you think in the comments. 

Wouldn't it be nice if the Invision Community editor could re-use whole replies, text snippets, and even reply templates?
As we get ready to welcome more customers into our staffed community support area, this feature idea has become a reality to help form personalized replies.
Invision Community has a saved actions feature that allows the community team to perform multiple actions on multiple topics. For example, you might want to add a title prefix, move the topic and add a reply. This works great for 'canned' responses and actions, but it is less useful if you want to edit the reply to personalize it.
Stock replies allow you to set up entire replies, partial replies or even reply templates.

Stock replies via the editor
Once you have these set up in the Admin Panel, they are visible on the editor.

Stock replies are configured in the Admin Panel
You can choose multiple stock replies to build up a message with handy re-usable reply snippets.
stockreplies_video.mp4
Each stock reply has full permission capabilities, meaning you can specify which member groups can use each stock reply. For example, you may wish to create partial replies for your team but encourage members to use a reply template to report bugs, etc.

Using stock actions as a template
We hope you like this feature, which is coming to our 4.6.7 October release.

Invision Community has had different view modes for a good number of years.
Forum grid view was added to create some visual interest when listing forums, and we've had expanded and condensed view modes in streams since they were introduced.
We've taken both of these views a step further in Invision Community 4.5
Forum Grid View
To create even more visual interest, the grid view now allows you to upload, or choose a stock image for the header. This instantly makes for a more dynamic and inviting forum list.

The new grid view image headers
You can choose an image from the Admin CP when creating or editing a forum.

Choose a stock photo, or upload your own
Topic List View
For the topic list view, we have taken inspiration from our stream view options to introduce a new 'expanded' view mode, which displays a snippet of the first post.

The new expanded topic list mode
This immediately entices you to engage with the topic because you can read part of the post without having to click inside to see if it interests you.
This is controlled via the Admin CP, where you can choose the default view, or turn off the new view completely.
Other Changes
You may notice a few other subtle changes in these screenshots. The first is that we now included the follower count as a metric on both the forum grid view and the topic expanded view modes. The number of followers is usually a good indicator of how others perceive the value of the content. A higher follower count generally means a more engaging topic or forum.
You can also see that we've switched to a short number format to keep the displays clean. Instead of say, "2,483 posts", it will merely say "2.5k posts". Reducing visual clutter is always crucial to maintaining a clean user interface.
We hope that you find these new view modes useful and that they make your community even more vibrant!

A topic is more than a collection of posts; it's a living entity that ebbs and flows over time.
Evergreen topics can see month-long gaps between posts and longer topics spanning numerous pages can end up hard to navigate through to find useful content.
With this in mind, we've added numerous improvements to the topic view to bring context and summaries key areas within the topic.

Topic view updates
Topic Activity
The first thing you likely spotted in the above screenshot is the new sidebar. This acts much like a summary of activity within the topic. It very quickly lets you know how old the topic is and how long it has been since the last reply. This context is essential if you are unwittingly replying to an older topic.
Most topics are driven by a handful of key members. The topic activity section shows you who have been most active, which may influence which posters you give greater authority to.
Likewise, popular days lets you dig into the 'meat' of the topic which may have evolved quickly over several days.
More often than not, a single post attracts more reactions if it is particularly helpful or insightful, and this is shown too.
Finally, a mini gallery of all upload images allows you to review media that has been attached to posts.

The topic activity summary under the first post
This activity bar can be shown either as a sidebar or underneath the first post in a topic. If you enable it for mobile devices, then it will show under the first post automatically.

The topic activity summary on mobile
As with many new features in Invision Community, you have several controls in the Admin CP to fine-tune this to your communities needs.

AdminCP settings
Other improvements
The eagle-eyed among you will have spotted a few other changes to the topic view.
The first is the badge underneath the user's photo. The shield icon notes that this poster is part of the moderation team. Of course, this badge can be hidden for communities that do not like to draw attention to all their moderators.

You will also notice that when the topic starter makes a reply to a topic, they get an "author" badge as their reply may carry more authority.
When you scroll down a topic, it's not often apparent that there has been a significant time gap between replies. For some topical topics (see what I did there) this may alter the context of the conversation.
We have added a little identifier between posts when a period of time has passed between posts.

These changes add a little context to the topic to give you more insight into how the replies direct the conversation.
The new topic activity summary gives you an at-a-glance overview of key moments and posters to help you navigate longer topics.
We hope that you and your members enjoy these new features coming to Invision Community 4.5!

We are currently living through one of the most turbulent times in history.
A once-in-a-century pandemic has a grip on all of us.
Whatever the outcome, come the end of the year, few of us are going to be the same again. We will have to sacrifice our personal freedoms, and some of us much more.
Like you, I'm worried about my family, my friends and neighbours. I'm watching the news, scrolling through social media and consuming articles from scientists, scholars and doctors.
The news coming out of Italy is truly heartbreaking. Doctors and nurses have to make life and death decisions daily as they wage war with the virus. Those of us in the UK and the USA are nervously watching the graphs climb in lockstep of Italy from just a few weeks ago.
It would be easy to succumb to fear and withdraw completely.
But as community leaders, we cannot.
Let us take some inspiration from the brave people of Italy who have suffered much with an overstretched health care system and enforced quarantine yet still sing from their apartments in a display of resolve.
In a time where we have to remain apart, we must come together.
We have to keep showing up and leading.
We must focus on what we still have and not what is being taken away.
Now more than ever, we are needed to keep the world connected. To bring comfort; to support and to love each other.
This year is going to test every one of us.
But whatever comes our way, I know that we are stronger together.
"Their faithful and zealous comradeship would almost between night and morning clear the path of progress and banish from all our lives the fear which already darkens the sunlight to hundreds of millions of men."
Winston Churchill

On behalf of the Invision Community staff and company, I'd like to wish our clients and community warm blessings and gratitude for the New Year.  
We're proud to be the community platform of choice for you and your organization over the past year (or decade!), empowering you and your users with the space to debate, discuss, investigate, solve, innovate and celebrate a shared sense of purpose.  The ability to positively touch and connect with the lives of others regardless of location is one of the most transformative benefits of the modern web -- and there's never been a greater demand or need for online communities to connect members in an authentic, branded experience.  
Your community is the gift that keeps on giving, and we're delighted to be a part of it. 
Here's a round-up of the 2019's most visited, most commented, and most clicked-on articles from the Invision Community Blog:
Invision Community managers use tools like Saved Actions and Auto Moderation to work smarter with 5 of the best time saving features Avoid the Engagement Trap, a never-ending race that measures all the wrong metrics in a community The crowd goes wild in the teaser announcement of the forthcoming mobile apps for iOS and Android Go back in a time machine with a Decade in Review - a celebration and testament to the enduring power of community.   Once again, may the magic and wonder of the holiday season stay with you throughout the year!

Online communities shine with the brilliance of humanity. Every day, our communities inspire, evoke, inform, motivate and engage in a hundred different ways.  Every member feels a uniquely individual sense of value from your community. 
For too many communities, the strategy revolves around two simple pillars: content and engagement.  You inform. You engage. And you think your job is done.  However, you’ve barely scratched the surface of offering value. 
You need to expand the ways in which you strategically match your community to member value. 
New studies are coming out that show humans feel up to 27 emotions from admiration to triumph, and the best communities unleash a rainbow spectrum of value – functional and emotional, business to social - for their organizations and for their members.  This results in not just deeper and more extensive engagement, but greater financial payoff.
Indeed, research from global management consulting firm Bain & Company shows brands like Apple, Samsung, and Amazon that demonstrate multiple elements of value have x3 greater customer loyalty and x4 faster revenue growth than others.   
The elements of value can be divided into two broad categories.

Specialize in Functional Value
Don’t deliver content.  Deliver time savings, cost savings, risk savings, organization, connection, education, and variety.
What is the utility benefit to your users? 
Functional values are the core reasons why members would visit your community.  It forms the baseline rationale for your community’s existence, and you want to not just be good – you want to be the best in delivering functional value in your field.
Improve your Q&A boards for feedback, inquiry, or ideation.  Provide a template in a pinned topic where users fill out a consistent set of questions, so you can answer with the most appropriate and accurate options.  Use moderator tools like Recommended Replies to summarize and spotlight key points in a topic.  This saves time and focuses attention on expert information.    Super-charge the training for your response team.  Empower them to be subject experts by giving them private training, templates, and extra resources in a staff wiki so they can investigate the unique needs of user inquiries and provide the best responses.        Build a set of content resources in the Pages application, which is the most powerful application in the suite.  It can be used to create a set of content resources with unlimited custom fields, filters, and templates enabling you to offer variety, organization, and education that no other competitor can match.  Spark Emotional Value
Don’t deliver engagement.  Deliver admiration, amusement, awe, empathy,  joy, nostalgia, satisfaction, and triumph.
How does your community make your members feel better? 
Here’s a little secret.  Even though functional value is the foundation of your community’s value proposition, emotional elements are 50% more valuable.  Fortunately, Invision Community comes loaded with ways to recognize, reward, and promote members. 
Take the time to explain the purpose of a new group promotion, rank, or title.  Don’t let the reward be the goal in and of itself.  You should connect the feature with its underlying emotion by explaining what steps are required to earn the rank, how many others earned it, and what it’ll take to earn the next one.  Start with the Leaderboard.  Invision Community ships with the Leaderboard, which provides an overview of the most popular users and content.  Scan for up-and-coming members to investigate what triggers their emotional satisfaction; scan for popular content to discover what excites your membership.  Create multiple member journeys.  Most communities follow a pattern of new member to trusted member to moderator.  But members can become superusers in many ways. Members who enjoy nostalgia can organize a Year-in-Review topic. Members who enjoy affiliation should serve as Ambassadors to greet and mentor new members. Members who seek reputation will appreciate new outlets for publishing.  Define multiple pathways that strategically tap into the diverse desires of your members.  As you implement your initiatives to build a Community of Excellence, take the time to relate the initiative to the Elements of Value (Attachment: IPS Elements of Value Attachment.pdf).  You’ll find new and creative ways of offering value to strengthen the relationship between your community and your members. 
Look deep within your community to unearth the rainbow spectrum of value. 
You’ll discover a wellspring of extraordinary value waiting to help your members shine brightest.