Palantir.net's Guide to Digital Governance: Web-Based Applications

Posted by Palantir on December 12, 2016 at 7:22pm
Palantir.net's Guide to Digital Governance: Web-Based Applications Palantir.net's Guide to Digital Governance brandt Mon, 12/12/2016 - 13:22 Scott DiPerna Dec 12, 2016Illustrated collage of website icons

This is the twelfth installment of Palantir.net’s Guide to Digital Governance, a comprehensive guide intended to help get you started when developing a governance plan for your institution’s digital communications.

In this post we will cover...
  • Common internal applications you may deal with
  • Common third party applications you may maintain an account for
  • Questions to consider about all types of web-based applications

We want to make your project a success.

Let's Chat.

Web-based applications typically add some functionality to your website that it otherwise would not be able to support on its own. These applications tend to come in two varieties:

  • those that have been developed internally by your own organization, and
  • those that are a service provided to you by a third party (typically a paid service)

Generally speaking, it is likely that internally developed applications are hosted and supported by your organization. When you have an issue, you probably talk to your IT team about it.

Some common internal applications:

  • User authentication
  • Organizational profiles or staff database system
  • Image database system or repository
  • Document database system or repository
  • Enrollment or student application forms
  • Programs and courses database systems
  • Products database system

Third party applications are probably accessed via the internet by your website and your users. You (or someone at your organization) probably maintains an account for that service, which you probably pay for monthly or annually. When you have an issue, it is likely someone contacts the third party’s support team for help.

Some common third party applications are:

  • E-commerce or an online shopping tool
  • Donations tool
  • Events with RSVP and ticketing
  • Appointments, room scheduling
  • Live chat

Technically speaking, tools like YouTube, Vimeo, Flickr, etc. are third party application services as well, but they are so easily integrated into your site, often with little or no costs or maintenance, that they require little attention. Still, they may be worth examining when considering governance.

Given the landscape above, your organization likely has several web-based applications – whether those are custom-built applications or third party solutions – which are used to perform specific functions and tasks. Here are some important questions to consider about all of these applications when defining an ownership and governance plan:

  • Who owns each application?
  • Who is responsible for its technical maintenance and support?
  • How are new custom applications developed?
  • Is there a process to follow for making functional changes to internally developed applications?
  • How is content in the application edited or changed?
  • Who is able to change content?
  • Who is responsible for maintaining content in the application?
  • Is there a process to follow for making content changes?
  • How are new third party applications, solutions, or services acquired?
  • Who controls the account, if it is a third party application?
  • How are third party services expanded or scaled across the organization if needs grow?

There are certainly many more considerations to make based on the specific application or service, and the functionality it offers. I recommend evaluating each application that is a functional part of your website to determine the appropriate governance policies for each.

 

This post is part of a larger series of posts, which make up a Guide to Digital Governance Planning. The sections follow a specific order intended to help you start at a high-level of thinking and then focus on greater and greater levels of detail. The sections of the guide are as follows:

  1. Starting at the 10,000ft View – Define the digital ecosystem your governance planning will encompass.
  2. Properties and Platforms – Define all the sites, applications and tools that live in your digital ecosystem.
  3. Ownership – Consider who ultimately owns and is responsible for each site, application and tool.
  4. Intended Use – Establish the fundamental purpose for the use of each site, application and tool.
  5. Roles and Permissions – Define who should be able to do what in each system.
  6. Content – Understand how ownership and permissions should apply to content.
  7. Organization – Establish how the content in your digital properties should be organized and structured.
  8. URL Naming Conventions – Define how URL patterns should be structured in your websites.
  9. Design – Determine who owns and is responsible for the many aspects design plays in digital communications and properties.
  10. Personal Websites – Consider the relationship your organization should have with personal websites of members of your organization.
  11. Private Websites, Intranets and Portals – Determine the policies that should govern site which are not available to the public.
  12. Web-Based Applications – Consider use and ownership of web-based tools and applications.
  13. E-Commerce – Determine the role of e-commerce in your website.
  14. Broadcast Email – Establish guidelines for the use of broadcast email to constituents and customers.
  15. Social Media – Set standards for the establishment and use of social media tools within the organization.
  16. Digital Communications Governance – Keep the guidelines you create updated and relevant.

Stay connected with the latest news on web strategy, design, and development.

Sign up for our newsletter.

Intermittent PHP7 Compatibility Notices, And Where To Find Them

Posted by Pantheon Blog on December 12, 2016 at 6:24pm
If you’ve spent much time upgrading older websites to PHP 7, it’s likely you have encountered the annoying situation where PHP notices are printed directly into the HTML output, causing them to display in an ugly, unformatted jumble at the top of the page. The effect looks something like this:

Restoring a Drupal 8 site from Configuration Files

Posted by Evolving Web on December 12, 2016 at 6:15pm
Restoring a Drupal 8 site from Configuration Files

As Drupal 8 "relies" on a Configuration Management (CM) system, one of its cool improvements is restoring a Drupal 8 site from an existing configuration instead of only a database dump. This means that you can do a brand new Drupal installation and replicate an existing configuration on your new fresh database!

read more

Acquia Drupal 6 Support Stops, as Drupal 8 Strides Ahead

Posted by Appnovation Technologies on December 12, 2016 at 5:19pm

With the growing popularity and prevalence of Drupal 8, it should come as no surprise that many Drupal development companies are slowly edging away from suppo

AGILEDROP: Drupal Commerce 2.x for Drupal 8

Posted by Agiledrop.com Blog on December 12, 2016 at 10:12am
Recent events, when Acquia announced its partnership with Magento, shook the Drupal community. Blog posts and tweets were written to ensure Drupal commerce is not neglected. Do we need yet another commerce platform? How can Drupal Commerce survive in the world of Shopify and WooCommerce, where setting a simple web shop takes a day or less? It makes sense that we ask ourselves if we even need a commerce solution for Drupal when there are so many doing it, and doing it more efficient.  Let's step back and try to understand what e-commerce is, because it's not only a shop that sells… READ MORE

Co-operative.club - The History, Part I: Project Blueprint and First Test Space

Posted by Steve Purkiss on December 12, 2016 at 12:11am
Co-operative.club - The History, Part I: Project Blueprint and First Test Space Co-operative.club header image - a fireside scene with leather chairs and the text co-operative.club displayed Steve Purkiss Mon, 12/12/2016 - 00:11

This is the story of how the Co-operative.club concept came about and this part takes us up to what happened when I had my first opportunity to test things out in a space in real life ten years ago. It covers my initial encounters with the Drupal project, and throughout the series you will see how it is integral to the success of this collaborative spaces project, gain an understanding of why it is very different to other software it is often compared to, how it changed my life, why I believe it will become the dominant system for building web-based systems within the next three years, and how it - and this Co-operative.club project - could help you to realise your dreams whatever they may be - no technical know-how necessary. You're free to call me crazy if you believe I am once the story's done, for now just enjoy the ride and keep your mind open ;)

As I start to brain-dump everything onto the GitLab group of projects for the construction of Co-operative.club I believe it is necessary to tell this story - there's quite a few angles to the project meaning the sum is greater than the parts which, individually, are potentially in orders of magnitude easier to build and/or exist already. This will help understanding of the concept, what has been tried out already, and what is going to be involved in the successful construction of it. It's not going to be a quick one, so grab a drink and hold on tight...

In the beginning, there was the BBC 'B'

BBC MicroI grew up in a little village in Essex in the East of England where there wasn't much to do apart from play in the fields. When I was 9 the BBC Model 'B' came out and I was lucky enough that my parents bought me one. The BBC ran a computer literacy project where there were programmes on telly about it and I along with many others learned how to code. I did my first "Hello World!" by coding 10 PRINT "HELLO!"; 20 GOTO 10 then I typed RUN and it displayed the word HELLO! all over the screen. Then I put a space after the exclamation mark, i.e. 10 PRINT "HELLO! ", ran the program again and it displayed HELLO! all over the screen, but this time it staggered the HELLO!s diagonally instead of neat columns and as it scrolled it was almost hypnotising - I was amazed that just changing something that small could make it do something so different, and I made it do that.

Skip on 35 years and I'm now making a living of essentially doing the same thing as I was then - seeing how something works and changing it to do what I want. I don't have to ask anyone's permission to do it, I have all the tools I need to do it, and from this I can live anywhere I like. I'm in control of what I do each day - if I mess up I've only myself to blame and I use the experience as a lesson to be learned. I've learned many lessons over the last ten years pursuing this vision.

The 'DotBomb' and the Return to Essex

When the DotCom bubble burst in 2001 I was working in London for a company who had built the first ever integrated, scalable modular framework of apps for rapidly constructing interactive web systems with modules covering content management, commerce, and collaboration functionality (blogs, forums, messaging, etc.), along with a web-based administration interface called TeamView for managing it, for example creating your own custom content types like articles, reviews, and so on. RemoteApps, as they named it, was essentially what Drupal is in terms of functionality - but a proprietary product.

I was the sixth person in the company - we grew quickly to sixty and had many big name clients along with some really innovative startups such as the first ever online horse-race betting site which calculated results and organised payouts, so I got to learn about Rule 4, which I've now completely forgotten. I worked on some amazing projects including B&Q's diy.com and was very proud when I developed an account they thought wasn't worth putting the effort into and turned it into their first six-figure project - to build Volkswagen's New Beetle microsite.

RemoteApps logo with the tagline integrating the futureI also helped the company communicate more cohesively internally by setting up an intranet, built using our own software as more people were building apps they weren't themselves actually using and I made people have to go there to get their expenses paid which ensured they actually used it. At the time we were growing fast and as Big Brother was on television I did a mock-up of their website but with profiles of team members so others could get to know them a bit better and it was a lot nicer than just a plain profile page on a corporate intranet.

Scaling a proprietary software company was expensive and hard work - were growing our integration partner network, training partners up on our modules and APIs, I was organising and running co-marketing events at trade shows; but the world changed on a dime and our funders suddenly pulled all their money out of their tech stocks resulting in finding myself redundant along with thousands of others in the industry at the time. No more free parties, which seemed to happen every week somewhere near to where I was living in Exmouth Market, Clerkenwell on the borders of Shoreditch, East London.

I was pretty gutted as I had share options which, on valuation at the time, were worth a touch over a million dollars, only to be worth nothing the next moment. I was surprised too as we'd just sealed a deal with Macromedia to incorporate our technology in their popular Dreamweaver (now owned by Adobe) website creation software where people could just drag and drop functionality into their websites - blogs, forums, etc. I wasn't involved in the business side of things at that level so it came as a shock to me at the time as I was only the previous week getting advised by my line manager about mortgages as there was a studio apartment in the Barbican Centre (where I used to skip school to go to classical concerts!) going for £80k - I think they're about £240k now. He knew at the time I was going to be made redundant but didn't say a word, and that's when I promised I'd never put myself in a similar situation again. On my way out for the last time I asked one of the co-founders what drop.org logo - the precursor website to drupalhe'd do differently if he ever did it again, he replied "I'd Open Source it". Little did I know that around the same time Dries had released his drop.org community site as Open Source code.

I then did a bit of freelancing work building websites for people in London but I didn't have enough to sustain my London lifestyle so returned back to Essex. I went to networking meetings and discovered BeyondBricks which was an online forum funded by the DTI for small businesses. I ended up helping people on there with advice on Free Software they could use to do things they wanted to do and won a few website projects through my visibility there.

Business Networking and the Birth of the Concept

logo of the now defunct ecademy business networkFunding from the DTI for BeyondBricks stopped and Ecademy bought it which was another online business network, built on the Free Software Framework Drupal, who's tagline at the time was "community plumbing". My first CMS, as with many others, was hand-rolled but I soon moved on to the plethora of PHP-based Open Source CMSs. A big blank blue screen which is the WordPerfect welcome screenI'd tried out Drupal during my research but didn't really understand how to use it and completely missed its abilities as all I was presented with was a blank screen reminding me a little of WordPerfect back in the days of my first job working in a local computer store - it presented you with a big blank blue screen and a cursor, you had to figure out the rest.

After flirting with PHPNuke but finding it restrictively run by one person who decided to hold back new stuff for paying members only, I tried the various other *Nukes however settled on XOOPS as it was more object-oriented which is what I was used to back in my DotCom days when I was using J2EE Enterprise Java.

Testimonial of Steve Purkiss from ecademy member Mark Posen saying Steve is simply *the* man to talk to if you want to know anything about open source. He is friendly, helpful and highly knowledgeable. Steve is highly recommended.

I enjoyed networking online and soon found myself being called "The Open Source Guy" - I loved meeting new people and helping them find out more about all the free stuff there was out there they could use to build and grow their businesses, learning from others, and the shared entrepreneurial experience. I set up and ran local Ecademy meetings in Essex as well as traveling up to the big meetings in London and others around the local area. I managed to gain a few clients which kept me going, but it always felt weird to say to people that I found my business in the backroom of pubs - this is when I first wondered why there weren't dedicated spaces for business networking meetings.

Many of the people I met worked from home, and the ones with offices still needed to get out to meet people. I was also aware that this Free Software that I was talking about didn't have a home either - you didn't find it in boxes in your local PC World store, and to help people find out what software would be useful for them it was always a conversation as opposed to selling them a product. I thought a space where these conversations could happen would be good, and it fit into the business networking space too. To me, the concept was obvious.

BlackStar and the Business Trip

Image of all the Wealth Dynamics profilesIn the Winter of 2004 Ecademy, in their ongoing quest to find a business model that worked and was sustainable, created a special 'BlackStar' group which cost a significant amount per month to join, but had special focused events which I liked the idea of so I joined. One event was a weekend of Wealth Dynamics training from entrepreneur Roger Hamilton held at Chatham House in London. The event was amazing and I was hooked on the Wealth Dynamics Profiling where I came out as a 'Star' profile - good at starting things, not so good at finishing. To be 'in flow' my natural ability is to promote other people's creations, and it is true that is what I do.

My Wealth Dynamics profile - predominantly Star

Through the BlackStar group I'd met Nick Heap who did this thing called 'Core Process' where through an exercise of writing down three times in your life you're especially proud of along with words you associate with them, then whittling them down to two you get the essence of you, mine is 'fostering connections', which does explain what I do in terms of both technology and people - I know what code can help you do something and I know what people can do what to help and I foster those connections, and quite frankly once I've done that I'm on to the next thing (that goes back to my Star profile, good at starting things). So since then it's been a quest to build a model around that which enables me to live 'in flow' instead of what I usually do which is try to do everything myself, that's where I fail.

At the time I had a mentor through the BlackStar group, the guy who had thought up the 0845 'free internet' connection which was the thing in those days - a shared revenue idea he had sold to a telecoms company. I was excited about my concept and wondered why people weren't throwing money at me - he suggested I needed to chill out a bit and have a break. He was doing a talk in Toronto that weekend so I thought where better to chill out than above the clouds and promptly booked flights and ended up flying the next day to Canada. I didn't know much about the country but had always wanted to visit that side of the pond and figured that's where the business was - everyone in the UK always seemed to want to put you down if you had big ideas.

PossiBox 1 - Toronto

I enjoyed my time in Toronto so much, I loved the people and the attitude and was so blinded by the big city and bright lights, and the reaction I had from people with my British accent that they actually seemed to listen to me, I thought upon my return I'd pack up and go live there for a bit and see if anyone there would throw me a bunch of money to get a place up and running. I did exactly that, and found myself wandering around a freezing cold downtown Toronto early Jan 2005 without a hat or scarf wondering where everyone was, not realising there was a network of tunnels with shopping centres underground!

I'd rented a flat in Queen Street West and went to every networking meeting I could, still thinking how cool it would to be to have a space for these people, and whenever I told someone about the concept they loved it but still no-one threw me a pot of cash. I even found a 'perfect' building but still no pots of money thrown. It was a HUGE building and had space for coworking on the top floor, meeting and conference rooms on the middle, public 'lounge' and retail space, and basement which would be perfect for audio/visual soundproofed spaces for people to record podcasts, vidcasts, etc. Here it is now courtesy of Google, looking a little better than when I wandered around it in its full emptiness glory!

Possibox 1 - a huge building in downtown Toronto

From 'Open Source' to 'Free Software'

At that time I was firmly in the belief that I was part of the Open Source crowd. I thought the space would be a great outlet for marketing Open Source-powered hardware, from watches to personal audio, gadgets of all types which I thought would be appearing on the seen rapidly - which there are more of now, guess I was a bit early to the scene.

The LinuxExpo was being held there where a friend (who I'd met on my first trip out there and said about my project, which at the time I was referring to as "the box" and had the domain "thebox.at", "it's like a Brain Gym") and I went out for a meal with one of luminaries of Free Software who was doing a talk and wanted to hook up the night before as he was at a loose end. He had spent his entire career reverse-engineering proprietary hardware drivers just so people could share files and printers between competing Operating Systems - Linux, Macs, Windows, etc. and most people didn't - and don't - know his software even exists to this day (Samba). He discussed the world of software and introduced me to a side I hadn't seen before, the business side of proprietary vs open source/free software. He started talking about Kings and Queens and power throughout centuries and who said what was right and what was wrong, and took me down a rabbit hole I'm still exploring to this day.

The Free Software, Free Society! wordmark

I hadn't realised the importance of Free Software in humans continuing quest for Freedom. My first jobs had been in computer shops and I hadn't realise the impact OSs like Windows had done to software by only providing compiled binaries and not the source code - the thing that I had the freedom to play with on my BBC 'B' as a kid and had provided me with an income for the few years since redundancy. I decided as the Free Software Foundation's AGM was on in Boston I had to go and that friend who'd come out for the meal with us offered to drive me so experienced my first state-side road trip to the mecca of MIT, which was an amazing place. Whilst I was there I explained my concept to Lawrence Lessig who created the Creative Commons licensing and he kind of understood it and said it was an extremely interesting idea, unless he was just being polite, but it seemed genuine, although he is a lawyer lol.

TestBox 1 - Uptown Toronto

Another friend whom I'd met at that first networking meeting I'd flown out for said his brother's old shoe shop was empty for a while and I could use it to test out my concept. I of course jumped at the chance and found myself in some upmarket part of Toronto which was miles out of the centre, but who cared? I had a space, and I was gonna give it a go. Personally I thought it would need to start in a city centre as it's a new concept people would need to get an understanding of before it spread out to the 'burbs (I still believe this to be the case).

We went to see the space, which was just a shop so no space for meeting rooms etc. but thought better than no space so set up a few computers I'd managed a local supplier of Linux PCs to lend us and awaited a few friends of friends to arrive with some art to display. Suddenly a hoard of artists turned up and there were about 100 pieces of art piled up in the basement! We sifted through and picked out some good pieces to display and hung them up. I filled a bookcase which had been left there with some tech and business books and magazines. We went shopping and bought a trolley load of booze, invited some friends and had a launch party. No business types came because I didn't have a big network of contacts, and we were miles out of the centre of the city. We did have a good party though.

So there was me, with a couple of friends, in a pretty much empty shop with some random PCs that no-one knew how to use, with no Internet connection as the phone line had already been disconnected, no website just a flyer on the front door which explained the experiment to bewildered passers by, and some random art on the wall, in the middle of Toronto's upmarket suburbs.

Needless to say this experiment didn't work very well, but it did educate. I've attached my original 'Blueprint' below, the picture on the front cover was taken looking down on the shop window display.

Front cover of the Open Source Coworking Cafe Concept with a computer box, a t-shirt and some books strewn across the shop window floor display

COMING UP NEXT: Co-operative.club - The History, Part II: You wanna building? I got a building for ya! Category Creativity Tags co-operative.club coworking cafe concept drupal Drupal Planet Drupal Architecture creativity Add new comment

Drupal VM 4 is Here! With PHP 7.1 and easy PHP switching

Posted by Jeff Geerling's Blog on December 10, 2016 at 10:23pm

Drupal VM 4.0.0 Release Tag - We've Got Company on GitHub

Seven months after Drupal VM 3 introduced PHP 7.0 and Ubuntu 16.04 as the default, as well as more stable team-based development environment tooling, Drupal VM 4 is here!

Thanks especially to the efforts of Oskar Schöldström and Thom Toogood, who helped push through some of the more tricky fixes for this release!

Why we chose Vue.js over React

Posted by Pixeljets on December 10, 2016 at 9:13pm

Qwintry team recently started active migration to Vue.js as a frontend framework in all our legacy and new projects:

  • in legacy Drupal system (qwintry.com)
  • in Yii2 b2b system (logistics.qwintry.com)
  • in all our smaller internal and external projects (mostly with PHP and NodeJS backends)

read more

Using hook_views_query_alter to alter a query

Posted by Chapter Three on December 9, 2016 at 11:47pm
Using hook_views_query_alter to alter a queryMotivation

When you first hear of Drupal's hook_views_query_alter you think you get it. You understand Drupal's hook system (presumeably, otherwise start here), you've used other hooks before, maybe you even experience a twinge of guilty excitement that it's one of the hooks that hasn't been removed from Drupal 8. You think to yourself, okay, this function will be passed a query argument, and I'll alter it -- and you're right! But it turns out it's a little more complicated than it sounds.

Migration of CSV Data into Paragraphs

Posted by MTech, LLC on December 9, 2016 at 8:59pm
Migration of CSV Data into Paragraphs

With the daily work of the office it is natural that there are challenges and potential research topics. With the addition of our developer Lucas as a Drupal core Migrate system maintainer, we decided to to delve into the little documented area of migrating data into paragraphs.

Paragraphs is the new way of creating content. It allows site builders to make things cleaner so they can give more editing power to their end users.

Charlotte León Fri, 12/09/2016 - 14:59

Preventing Drupal 8 from applying image styles to GIFs to preserve animation

Posted by Brian Osborne on December 9, 2016 at 7:44pm

I'm working on a site where the editorial staff may occasionally produce animated GIFs and place them in an article. Image styles and animated GIFs in Drupal don't play nice out of the box. Drupal's standard image processing library, GD, does not preserve GIF animation when it processes them, so any image styles applied to the image will remove the animation.

Competitive Analysis on a Budget

Posted by Palantir on December 9, 2016 at 4:10pm
Competitive Analysis on a Budget brandt Fri, 12/09/2016 - 10:10 Michelle Jackson Dec 9, 2016Illustration of hand-marked edits on wireframe of website

User research is a key element in meeting the needs of your audience, but can it be done on a budget? We think so.

In this post we will cover...
  • Why competitive analysis is needed

  • A cost-effective approach to meeting the needs of your audience

  • How to conduct competitive analysis on a budget

  • How to build a competitive analysis matrix

We want to make your project a success.

Let's Chat.

Your budget is tight. Project time constraints won’t accommodate extensive user interviews or surveys.

These common project parameters can make it challenging to understand the needs of the audience your website serves. Competitive analysis is an affordable way to evaluate and understand the ways in which competitor sites are succeeding or failing to meet site visitor needs.

By the time you are finished reading this post, you will have the know-how to do a competitive analysis for your organization or company’s website and will be able to see how your website measures against the competition.

What is competitive analysis?

Competitive analysis is a user experience research technique that can help you see how your site compares with competitor websites in terms of design and functionality. It can also lead to better decision-making when selecting new design and technical features for your site (e.g. search filter terms or search listing display).

Competitive analysis evaluates competitor sites at a level that goes further than first impressions. It can help you understand if the competition’s efforts to meet user needs are working before you invest in and implement new designs and technical features.

Let’s imagine you have been tasked with redesigning the Detroit Pistons website and are reviewing and bookmarking some of your competition’s websites. Taking a look at direct competitors is the first step.

First, we’ll take a look at the Chicago Bulls and the Detroit Pistons - two direct competitors. The two teams are considered direct competitors because both are professional basketball teams that offer the same service and function in the same way. Ticket sales, merchandise, team branding, and game schedules are some of the main priorities of website visitors. Both websites are hosted by the NBA.

Each team uses a different approach when it comes to presenting information in the navigation. Let’s consider how the two teams differ in terms of menu labeling and hierarchy. Tickets come first and foremost for both teams. Since tickets generate revenue, prominent placement in the navigation underscores the high priority of this transaction. With the exception of “News,” the two teams place the same emphasis on “Team” and “Schedule.” At a glance the Chicago Bulls navigation is more effective in their use of menu terms that reflect distinct priorities and desired user actions on the site.

Chicago Bulls navigationFigure 1: Chicago Bulls navigation

The Detroit Pistons’ navigation offers a host of items that may distract the user from completing key priority actions (e.g. buy a ticket, review the schedule, check out the team or buy merchandise), which are clearly prioritized in the Chicago Bulls navigation.  Looking at the Detroit Pistons navigation, it is not clear what different actions the visitor should take on the site using the navigation. “Fan Zone,” “Game Night,” could be housed under “Community.”  Diving into the “Video” navigation item, “Fan Experience,” has a similar connotation to Fan Zone which creates a more fragmented experience for visitors navigating the site. “Instagram” is listed under “Video” which may be redundant since there is already a social media icon for Instagram in the main navigation.   

Detroit Pistons navigationFigure 2: Detroit Pistons navigationDetroit Pistons naviation / videoFigure 3: Detroit Pistons navigation | Video

Now that we’ve done a cursory comparison of how two direct competitor websites use their navigation, let’s talk about how competitive analysis can meet user needs without breaking the bank.

Competitive analysis on a dime

Competitive analysis is flexible. This type of research method can be customized to your budget and project needs. Evaluating the navigation for the Detroit Pistons and Chicago Bulls took about 15 - 20 minutes, but the impact (for the Detroit Pistons) of simplifying the navigation could be substantial in improving site visitor experience.

Competitive analysis can run anywhere from a few hours (if you have a tight budget) to several weeks. Research by experts in your industry and publicly available data on user trends, behavior and needs can supplement evaluation and assessment of your site against the competitions’ sites.

In addition to evaluating the usability of the features and designs of your site along competitor sites, you can also perform user tests on competitor websites to validate their assumptions about what does or doesn’t work for users. We typically implement competitive analysis after conducting a series of interviews with stakeholders. Like our process for developing personas, our competitive analysis methodology is also based on high-level stakeholder input, data produced by clients, and site analytics.

Competitive analysis in action

The competition

Selecting four-to-seven competitor sites to evaluate alongside your site is a critical first step. Depending on time and budget, competitive analysis can focus on direct competitors, or partial, parallel, or even analogous competitors.

Competitor types

  • Direct - offer the same service/functions in the same way
  • Indirect - offer the same service/functions in a different way
  • Partial - compete with some, but not all services/functions
  • Parallel - offer a similar service/function to a similar audience via a similar channel
  • Analogous - a non-competitor that might give ideas about how to provide functions in a better way

Let’s use the Detroit Pistons as our point of comparison and see how other sports and entertainment offerings in the Chicago area relate to the Detroit-based professional sports team.

The Northwestern Wildcats is an indirect competitor. The Chicago-based basketball team offers the same service as Detroit Pistons, but in a slightly different way. The fan base, or audience, is slightly different and the team competes against other college sports teams in the NCAA. Merchandise associated with the Wildcats primarily focuses on the institution and not the team itself. The team is also based in a different market.

Chicago Blackhawks, while a completely different sport, is a parallel competitor. Both hockey and basketball are spectator sports that offer similar services during the same season, and have a fan base with some overlap. Both the Detroit Pistons and Chicago Blackhawks require that spectators spend time and/or money watching a professional team compete to score against an opposing team. Both teams also sell merchandise.

Comedy theater, The Second City, is a partial competitor. The Second City not only sells tickets for live entertainment, but also has educational offerings for professionals seeking to hone their improvisation technique and relate better to customers. By including educational offerings, Second City’s services differ slightly from those offered by the Detroit Pistons.

An analogous competitor is Hamilton Broadway. The musical provides entertainment to spectators, sells merchandise and relies heavily on ticket sales. The show is also seasonal, although the show’s duration is shorter than professional and college sports.

Competitive analysis can help establish a baseline for web design in your industry. Choosing competitor sites that capture different segments of your market and have had recent redesigns is key. It can help us understand how user needs are met by competitor websites serving the same or similar audiences. It can also help us evaluate if a competitor’s newly minted design and technical features are meeting user needs in a new and improved way. This, in turn, can lead to better and more cost-effective decisions that consider site visitor needs when designing and building your site.

Dimensions

Identifying the criteria for evaluating competitor sites is a crucial second step. Navigation was just one dimension to consider when looking at the Detroit Pistons and the Chicago Bulls. We consult closely with clients when selecting dimensions. Dimensions may include:

  • Content (e.g. stories featuring specific audiences or influential people)
  • Design (e.g. organization leader profiles)
  • Technical features (e.g. use of filters for search functionality)
  • Specific pages (e.g. Home page)
  • User support (e.g. FAQ)

During the review and evaluation process, you may add additional dimensions and dimension subcategories if new trends are uncovered when looking at competitor websites.

  • Dimension - Descriptive content
  • Subcategory 1 - Homepage
  • Subcategory 2 - Use of video

So what next?

As a first step, you develop research questions to guide your evaluation of each site.

  • How does each website help users achieve key tasks?
  • How is content prioritized on pages where key tasks take place?
  • What types of descriptive content is featured on the Homepage of each site?

Then you build a competitive analysis matrix featuring competitors (x axis) and dimensions (y axis) in a spreadsheet.

For the Detroit Pistons and its competitor sites, you can list notes about certain features of the current sites. For the navigation, you might review and compare the number of items in the primary navigation, the prioritization of navigation items and/or the type of language (formal/informal) used for navigation terms.

For tickets sales, you might look at how information about tickets and ticket promotions are presented on the homepage. You can compare display of ticket information on the tickets landing page for each site. When looking at the game schedules, you might consider how and if visitors can access the schedule from multiple parts of the website.

Use this simple competitive analysis matrix to see how these sites measure up against each other!

Competitive analysis matrixFigure 4: Competitive analysis matrix

Next, we:

  • Speak with stakeholders who manage the site
  • Identify the types of competitors (e.g. direct, indirect, partial, parallel and/or analogous)
  • Select four-to-seven competitor sites
  • Create a preliminary list of dimensions
  • Evaluate competitor sites

Once you’ve done your research and completed the matrix

Now it’s time to tackle competitive analysis.

  • Identify patterns and similarities across competitors
  • Highlight competitor site strengths and trends
  • Handpick design elements, technical features and content that work well
  • Collaborate with design, technical, and stakeholder experts to validate your findings

Citing your work and providing documentation in the matrix provides a point of reference for clients and team members. It can also help validate conclusions. Presenting your findings, screenshots, and recommendations in a slide deck or report can help design, technical, and stakeholder experts understand and draw inferences about your research for consideration during the design and technical implementation of your site.

In sum

Competitive analysis is an affordable user experience technique. It can establish a baseline for how competitor sites are doing. You can learn from competitor site successes and failures to make cost-effective decisions during the design and build of a site. Lastly, competitive analysis can help us achieve user-centered design and development outcomes while avoiding the web design and technical blunders of the competition.

We feel strongly that competitive analysis and other such strategy work is essential to a project's success. Let's schedule a time to talk so we can share our approach to getting to a place of success for your organization and project.

Stay connected with the latest news on web strategy, design, and development.

Sign up for our newsletter.

Application updates for PHP containers

Posted by Platform.sh on December 9, 2016 at 2:00pm

PHP was Platform.sh’s first supported language, and so has had a few quirks as we’ve grown to support more programming languages. Those quirks have resulted in a few limitations to functionality that we didn’t like, and you probably didn’t like, either.

Fortunately, we’ve refactored our container support to reduce the uniqueness of PHP and added a bit of functionality along the way.

Bringing pages to life with web animation

Posted by Ixis.co.uk - Thoughts on December 9, 2016 at 11:25am

We’re using animation in a few places on ixis.co.uk, mostly subtle movements to try and inject a bit of life into the design. The key thing when we were adding these animations was to keep them subtle. If at any point they make the actual content on the site harder to read then we've failed.

On mobile, the menu button animates into a close button when it’s opened. This is fairly simple. When the menu is opened, we add an open class to the button, and use some CSS3 transforms to move things around. The relevant Sass is below, the main thing is we add a 0.3s transition on opacity and transforms, and then just move things when the open class is added.

.navbar-toggle {
  .icon-bar {
    transition: opacity 0.3s, transform 0.3s;
  }

  &.open {
    .icon-bar-1 {
      transform: translate(0, 8px) rotate(45deg);
    }

    .icon-bar-2 {
      opacity: 0;
    }

    .icon-bar-3 {
      transform: translate(0, -8px) rotate(-45deg);
    }
  }
}

The transforms occur in order from left to right, even though they animate all at once, which is why we move first, and then rotate. Otherwise the movement would be relative to the new rotation.

Our fancy animated icons

Our new service icons are SVGs, which means we can target individual elements within the icon to animate, as long as the SVG is inline and not embedded with an img tag or background-image style. To make life easier we added theme implementations for them on the Drupal side, so they can easily be added and reused. Then we have an icon-development.html.twig file that contains the SVG.

/**
* Implements hook_theme().
*/
function example_theme($existing, $type, $theme, $path) {
  return array(
    'icon_development' => array(
      'variables' => array(),
    ),
    // ...
  );
}

We’re using CSS3 keyframes for the animations themselves, which means we can easily trigger them when we scroll them into view. In our Sass a lot of the values are shared with placeholders, but I’ve tried to simplify them here, and it’s only showing the animation for one part of one of the icons.

#service-development {
  .bracket-left {
    animation-duration: 1s;
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
    animation-play-state: paused;
    animation-name: developmentBracketLeft;
  }

  &.scrolled-to .bracket-left {
    animation-play-state: running;
  }
}

@keyframes developmentBracketLeft {
  0% {
    transform: translate(-4px, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}

Since all of our animations are fairly short, we had to make sure they’d only trigger once they’re visible, otherwise it’s just a waste of time. So we’re using waypoints to add a ’scrolled-to’ class when animations should trigger. Javascript is only used for these triggers, the animations themselves are pure CSS, so they benefit from hardware acceleration. We're using this approach for virtually all of our animations, from the service icons down to subtle fade in effects on things like heading banners, testimonials and client work pages.

(function ($) {
  Drupal.behaviors.magicksServiceAnimation = {
    attach: function (context, settings) {
      $('.view-services').waypoint({
        offset: 'bottom-in-view',
        handler: function() {
          $('.view-services').addClass('scrolled-to');
        },
      });
    }
  };
})(jQuery);

The fade in effect is a combination of 2 transitions. It moves from 0 opacity up to 1, and it moves 100px up and into it's correct position. This particular effect is all wrapped in a Sass mixin, so it can be easily reused on new elements, and only ever needs to be changed in one place.

On the blogs page we have infinite scrolling, with a rotating Ixis logo to show that new content is loading in. Not much to this one: it’s the standard Drupal Ajax progress throbber, we’ve just styled it with CSS and animated with keyframes.

Improve Website Performance & User Experience with PHP 7: An Exclusive Look at How Cheeky Monkey Media Did It

Posted by Cheeky Monkey Media on December 8, 2016 at 10:17pm
Improve Website Performance & User Experience with PHP 7: An Exclusive Look at How Cheeky Monkey Media Did It shabana Thu, 12/08/2016 - 22:17 PHP 7 Upgrade Gives Cheeky Monkey an Extra Little Something

When we decided to convert the Cheeky Monkey Media corporate site to PHP 7, we expected some improvements in web performance

  • We expected the site to run faster and smoother.
  • We expected the page loads to be quicker.
  • We expected these results to leave the end-user (the individual viewing the site) to have a more satisfactory user experience.

In reality, we got all these things, plus a new-and-improved corporate site with some mega pizzazz. The switch to PHP 7 gave our site renewed energy and speed, giving the end-user, blazing fast page loads and an overall quality experience.

You can make the shift too. Contact us today.

Talking Laravel with Matt Stauffer

Posted by Lullabot on December 8, 2016 at 9:00pm
Matt & Mike talk with "Laravel Up and Running" author Matt Stauffer about the Laravel PHP framework and how it differs from PHP and Drupal as a whole. They are joined by Lullabot developers Andrew Berry and Matt Robison.

Roomify releases community edition of Roomify for Accommodations

Posted by roomify.us on December 8, 2016 at 8:27pm
We are thrilled to announce that as of today, roomify for accommodations is freely available and, as always, completely open source! Today we're going to share some of our motivations for making rfa widely available, and talk about some of the projects we hope to see in the community.

Drupal Modules: The One Percent — Form Placeholder (video tutorial)

Posted by Drupal Modules: The One Percent on December 8, 2016 at 7:52pm
Drupal Modules: The One Percent — Form Placeholder (video tutorial) Project page screenshot NonProfit Thu, 12/08/2016 - 13:52 Episode 11

Here is where we bring awareness to Drupal modules running on less than 1% of reporting sites. Today we'll look at Form Placeholder, a module which will replace your form's textfield labels with placeholder text.

Dropcast: Episode 26: Let Us Give Thanks

Posted by Mediacurrent on December 8, 2016 at 6:55pm

Recorded Nov 30, 2016

This episode, the whole crew is together again, and since we recorded it sort of close to the Thanksgiving holiday, we talk about the things we are most grateful for in the Drupal community. As always we have Drupal News, featured blog posts and the ever popular, Final Bell.

What’s new on Drupal.org? - November 2016

Posted by Drupal.org blog on December 8, 2016 at 5:27pm

Read our Roadmap to understand how this work falls into priorities set by the Drupal Association with direction and collaboration from the Board and community.

The engineering team at the Drupal Association had much to be thankful for in November. With the support of the wonderful volunteers in our community and the contributions of our Supporting Partners we were able to deliver some great tools for the project. Let's dive and see what's new.

Drupal.org updates

Promoting Drupal by Industry

In November we finished the technical scaffolding for the upcoming industry pages, and began working with the wider Association team on content development for these pages. Because we were ahead of our internal targets for this page and we felt it would add significant value, we've also added the ability to geotarget content on these industry pages.

This is the first instance of geo-targeting on Drupal.org, and we'll be using it to help connect Drupal evaluators with regionally appropriate content and partners on these pages. Work on the industry pages is ongoing, but we're excited to bring them to you soon.

Developer Tools Evaluation

During November the engineering team also had a two day retreat here in Portland, OR with webchick - one of the members of the Technical Advisory Committee. We used this retreat to do a deep dive into the current state of developer tools on Drupal.org, and to evaluate our options to continue evolving the tools we offer to the community.

We gave a summary of our exploration along with some next steps to the Drupal Association Board on November 22nd. You can find the minutes and a recording here.

Core release packaged with --no-dev composer dependencies

Starting with the Drupal 8.2.3 release, we are now packaging full releases of Drupal core with --no-dev composer dependencies. This means that packages downloaded will not include extraneous developer extras that should not be used in production sites, and that the release packages will be smaller. We will continue to package dev releases with the dev dependencies.

Feature branch testing support

Drupal.org allows maintainers to create feature branches for issues by using the name format [issue#]-[short-description]. Any commits made to a branch in this format will appear in the sidebar of the associated issue. To improve the utility of these feature branches, DrupalCI patch file tests now also run on push to these branches.

Feature branch testing UI on issues

To add tests, users can simply click on the 'add test' link beneath the git branch in the issue sidebar, or click on the existing test result bubble to re-test or add a new test. Since this feature was introduced we've run over 200 issue branch tests.

Project maintainers can add Documentation Guides

UI for relating guides to projects

Display of related projects on Guides
We're continuing to support the migration of documentation to the new documentation system, and we've now enabled Project Maintainers to add related documentation guides to their projects. Once added, the related projects will appear on the documentation guides, in the sidebar.

Documentation Maintainers can find their Guides

Many community volunteers have stepped up to become maintainers of the new documentation guides. We want to make sure we're giving them the tools they need to do the work of maintaining those guides and the pages within them.

Your Guides tab on user profile

We've added a 'Your Guides' section to the user profile which will list all of the guides that a user maintains, as well as the pages within those guides. This should allow maintainers to see when pages have been recently changed or added, and to easily keep their guide content curated and up to date.

Infrastructure

Virtualization and Improved Config Management

In November, we completed the majority of two major infrastructure projects. Firstly, we've virtualized the majority of the infrastructure and standardized on Debian 8 images. Secondly we've updated our configuration and user management from Puppet 3 + LDAP to Puppet 4 + Hiera. This is a significant milestone for our infrastructure, and gives us a more portable and maintainable infrastructure to manage moving forwards.

Community Initiatives

Community initiatives are a collaboration; with dedicated community volunteers building improvements to Drupal.org with the architectural guidance and oversight of the Drupal Association engineering team.

Drupal 8 User Guide Launched!

We're very happy to say that the Drupal 8 User Guide is now live on Drupal.org! This documentation guide is carefully curated to provide all the information a new user needs to become skilled at managing a Drupal 8 site. We want to give a special thanks to jhodgdon for all her work on the User Guide project.

Initiatives need your help

Are you a Drupal.org power user who relies on Dreditor? Markcarver, who is currently leading the charge to port Dreditor features to Drupal.org, has invited anyone interested in contributing to join him in #dreditor on freenode IRC or the Dreditor GitHub.

Is the written word your domain? Consider putting your skills to use by becoming a maintainer of Drupal documentation. If you are a developer interested in contributing code to the new documentation system, please contact tvn.

———

As always, we’d like to say thanks to all the volunteers who work with us, and to the Drupal Association Supporters, who made it possible for us to work on these projects.

If you would like to support our work as an individual or an organization, consider becoming a member of the Drupal Association.

Follow us on Twitter for regular updates: @drupal_org, @drupal_infra

Pages

Subscribe with RSS Subscribe to Drupal.org aggregator - Planet Drupal