    
|
|
|
|
|
 |
“Can you put together a digital strategy for us to review?” Requests like this strike fear into those of us who work on the Web. What do we know about putting together strategy documents? Yes, we understand the Web, but we don’t know how to write a document that is essentially a business strategy. What even goes into a digital strategy!
Unfortunately, this is something management seems to increasingly request from Web designers. Whether you are an external contractor or part of an in-house team, sooner or later you will be asked to put together a digital strategy.
But do not despair. A digital strategy is not as intimidating as it sounds. It is just a document outlining how your company or client should handle the different aspects of digital from the website and mobile to email, social media and digital marketing. It doesn’t need to cover everything in huge depth (it would be unreadable if it did), but instead should establish some general approaches to these different areas.
This post will provide you with a crash course on where to start and what kinds of things to include. I hope it proves useful.
Whether you have been asked to produce a digital strategy or management have reluctantly listened to your pleas to be more strategic, getting to write a digital strategy is an amazing opportunity.
It is a chance to show your client or boss that you are more than an implementor and that you have a valuable contribution to make toward the future of digital.
“Creating a digital strategy is a chance to bring some order to the chaos that is most organisations approach to digital.”
Most companies approach the Web at a tactical level, making decisions on the fly in response to the latest new technology or business demand.
If like me you have worked on projects where the requirements have changed part way through or somebody in senior management has suddenly decided the company needs an iPhone app, then you know quite how reactionary most organisations are. There is little long term thinking in terms of development roadmap, governance, resourcing and policies.
By forming a digital strategy you have an opportunity to establish a firm direction for your online footprint, rather than being the victim of managerial whims.
So where do you begin?
You may be tempted to look at business strategy documents for inspiration. After all, these have been around for years and their format is well established. However, as is so often the case when looking to other mediums for inspiration, they don’t really fit digital.
A traditional business strategy focuses on two key components; a long term roadmap and budget forecasting. Unfortunately both of these elements are hard to replicate in a digital strategy.
Creating a digital strategy that looks 3–5 years ahead is an unrealistic expectation. Technology just moves too fast for that. Equally, accurate budgeting is difficult when the landscape is evolving at such a rapid rate. A digital strategy therefore has to take a different approach.
“A digital strategy needs to focus more on creating policies, priorities and people.”
A digital strategy needs to focus more on creating policies, priorities and people who can be trusted to make the right decisions as new technologies emerge, rather than defining everything up front. As the old adage says, its about “teaching a man to fish”.
What does it mean for your digital strategy to focus on policies, priorities and people?
Essentially, if the intention is to create a strategy that can adapt to the fast moving pace of digital, you need a flexible decision making process. This requires the right people making those decisions within the right kind of framework and then being able to implement those decisions quickly.
It’s therefore important that your digital strategy includes:
Who makes decisions about different digital elements and who actually does the work? This is the kind of thing that could be addressed using a responsibility assignment matrix. It is important that the right people are making the right decisions. For example, you don’t want the Head of IT making decisions on design, or the Head of Marketing picking a hosting environment. This happens all too often when the digital strategy is managed by a committee.
Adequately resourcing the digital strategy is also important. What work is going to be done in-house and what should be outsourced? When outsourcing, what criteria are used for selecting a supplier?
To enable fast decision making it helps to have a number of policies in place. Policies act as a framework within which operational decisions are made. In other words, instead of having to make a decision each time a scenario occurs, the decision has already been made and formalised into a policy.
A great example of this is a social media policy. What are staff allowed to say on social media? What is acceptable and unacceptable? Having a social media policy provides security for staff (they know what they are allowed to do), but also prevents the need to discuss every tweet before it is posted.
Policies are also great for resolving internal conflict. For example, having a policy for deciding what content appears on the site homepage can save a lot of conflict later. It moves the debate away from being subjective opinion to something more tangible.
The BBC have clear policies for the design style of their websites. Larger view.
Other policies could include:
These policies do not all need to be defined in the digital strategy, but they need to be identified and an approach for their creation established. Overtime, as each policy is put in place it needs to be agreed, documented and explained to stakeholders. The Government Digital Service does an excellent job at doing this in their service manual.
Disagreement over priority is probably the primary factor that slows down decision making over digital within most organisations. In an environment where fast decision making is crucial, outlining key priorities is so important.
The two most important priorities to set are business objectives and target audiences.
Most organisations seem terrible at even defining their digital business objectives and user groups, let alone prioritising them. It is therefore essential that any digital strategy you write does exactly that.
Without clearly defined priorities in these two areas you will have to argue about priorities every time they clash. Whether it be over homepage content or top level navigation, there will be numerous occasions where a clear list of priorities will help resolve conflicts and keep things moving forward.
Having a set of priorities becomes most useful is in the area of maintenance. If you are fed up with management pulling you from one ‘urgent’ set of tasks to another, you need a clear set of objectives. These prioritised objectives can help define whether or not something is truly urgent. Those who come with a ‘top priority’ request have to justify it against your agreed priorities.
In the past I have worked with clients who have a prioritised stack of features and content that their in-house team work through. When somebody wants to add a new feature to the stack, they must sell the feature to a Web committee based on user needs or business objectives. This then decides its place in the stack.
Clear priorities about your audiences and objectives will also allow you to create a preliminary roadmap.
Although creating the kind of roadmap you would see in a traditional business strategy document is unrealistic, that does not mean you cannot give at least some indication of a development program.
The emphasis of your digital strategy should be on immediate issues that need addressing. What are the most urgent areas where work needs to be done? Because these are to be actioned immediately, it is possible to provide a considerable amount of detail about how these can be tackled.
When looking further ahead the level of detail can be reduced. It may be possible to give a rough timeline of development priorities as far as two years ahead, but it must be made clear that this roadmap would be subject to change as the digital landscape alters.
To not include any kind of roadmap would prove unsatisfactory to most senior managers.
“Senior management lack confidence in digital because they don’t really understand it. They need a roadmap to reassure them.”
For senior management, a digital strategy is about quantifying the Web and giving them a sense of control over it. If all your digital strategy does is essentially say “trust your Web team and their policies”, this will not meet their need for control. A roadmap on the other hand (no matter how vague) will help give them the confidence they need.
But what areas should that roadmap encompass?
The exact scope of your digital strategy will vary depending on the organisation and what they do. That said, your digital strategy should encompass a lot more than the website. As Web designers it is easy for us to focus on the website, because that is what we know. However, digital is further reaching than that.
In most cases a digital strategy should encompass:
In each area the digital strategy should look at the benefits these technologies have for your business, assess its current performance and make recommendations over the short and long term.
This scope can prove challenging for an individual to address, as it requires such a broad knowledge. If that’s the case, it may be that your digital strategy will have to recommend getting in experts to provide more detail in certain areas. It is better to be upfront with your limitations than leave the strategy vague.
With so many competing areas fighting for attention and only limited resources available, it is hard to write a digital strategy without looking at budget.
In the end of the day, the main goal of every service is to make sure that people actually prefer using it. This could be the goal of every digital strategy, especially among government services websites. Image credit: Dafydd Vaughan.
Although it is impossible to define your digital strategy accurately enough to create detailed budgets, that does not mean you can avoid the subject of money. Senior management will need some indication of budget in order to plan expenditure going forward.
A good place to start is by shifting managements thinking away from a series of fixed cost projects to a program of ongoing development.
A program of ongoing development is much better suited to the evolving nature of the Web.
A common approach to this kind of ongoing development is to adopt an agile model (such as used by GOV.UK). This uses a continually evolving stack of prioritised features and content that needs developing. As elements from the stack are developed, new elements are added in a continual cycle.
This approach recognises that your website and other digital assets are never finished and that it therefore makes no sense to apply a fix price budget to them. Instead, expenditure on digital should be thought of as an annual, ongoing budget like you would spend on marketing. By shifting to an annual ongoing budget rather than a series of one off projects, budgeting becomes much easier.
If the company wants to manage digital in-house, then it is a matter of establishing approximate costs for an internal Web team. Looking at the proposed work levels will give you an approximate idea of how big the team will need to be and who to include. This in turn will allow you to establish costs once you include salary, equipment and training.
If the company needs to outsource some or all of their digital work then things become a bit more tricky. Ideally some form of retainer at an agreed level will probably work best. However, most organisations don’t like working with external contractors in this way. In that case it is a matter of quoting on some of the work scheduled in the roadmap and extrapolating this over the year.
This may all be sounding a little vague and that is because it is. As I implied at the beginning, budgeting digital work is notoriously difficult. However, it cannot be entirely ignored. A best guess, with a suitable amount of contingency added, is better than nothing. At the very least it will start a discussion with senior management about the level of investment they can maintain.
All of this talk about budgeting, policies and strategy may sound intimidating, but the truth is that there is probably nobody within your organisation or that of your clients who knows better than you how to put together a digital strategy.
It’s also important to emphasize that you don’t need to produce these documents in isolation. Putting together a digital strategy should be done in close collaboration with all stakeholders. You will not be working alone.
The problem is that nobody sees the creation of a digital strategy as their job, so if you don’t step up, then the chances are nobody will.
Don’t wait to be picked either. It is not uncommon for senior management to ignore the need for a digital strategy. Even when they do recognize the need, there is no guarantee that they will turn to you for it.
I would encourage you to be proactive in this area. Don’t wait to be asked. Offer to undertake this work or even just write a strategy document unsolicited. After all, as Grace Hooper says, “Its easier to ask for forgiveness than permission.”
Credits of image on front page: Dean Meyers.
(ea) (il)
© Paul Boag for Smashing Magazine, 2013.
]]>|
|
All over the web, sites are springing up, that use what is known as a parallax scroll. In essence, a parallax scroll is when content scrolls at different speeds, creating a sense of perspective and therefore depth.
It’s an appealing effect, and can be applied to as many layers as you like. In this article I’m going to introduce the basic principles by showing you how to build a simple two layer parallax effect.
To start off we need some HTML, we’ll include some filler text to be placed within a section and then another <div> that will hold our background:<div class=”bg”> </div>
<section>
<h1>Home page</h1>
<p>We are a fairly small, flexible design studio that designs for print and web. We work flexibly with clients to fulfil their design needs. Whether you need to create a brand from scratch, including marketing materials and a beautiful and functional website or whether you are looking for a design refresh we are confident you will be pleased with the results.</p><p>We offer the following services:</p>
<ul>
<li>Branding</li>
<li>Logos</li>
<li>Websites</li>
<li>Web applications</li>
<li>Web development – HTML5, CSS, jQuery</li>
<li>Content Management Systems</li>
<li>Responsive Web Design</li>
<li>Illustration</li>
<li>Business cards</li>
<li>Letterheads and compliment slips</li>
<li>Flyers</li>
<li>Mailers</li>
<li>Appointment cards</li>
</ul>
<h1>Sub page</h1>
<p>Before you choose us to take on your project you will probably want to know a bit more about us, so meet the team:</p>
<img alt="" src="http://lorempixum.com/500/600" /> <p>Ross has over 10 years experience in the industry. He is our Creative Director, digital designer, web designer and front-end developer. He is also pretty good with a sketchbook. Before starting the company Ross worked as a designer and studio manager for a design house who boasted a number of big name clients. Ross has brought his vast experience from this role to the work he does now.</p>
<p>Monica is Ross’ sister, our Art Director and specialises in graphic and print design. She has also worked with some big names and her designs have won her a number of industry awards.</p> <p>Rachel and Chandler are our Junior Designers. Rachel is a web designer with knowledge of HTML and CSS and supports Ross on projects. Chandler has just finished his Graphic Design degree and enjoys continuing to learn from Monica and building his experience.</p> <img alt="" src="http://lorempixum.com/500/600/sports" /> <p>Joey and Phoebe focus on bringing new business to the company. They have won a number of big clients recently and both also have qualifications in project management to ensure that the projects run smoothly from start to finish.</p>
</section>
This is all the HTML we’re going to need. All of the text is just to ensure that we cover the whole page so that scrolling is necessary. Let’s more on to the CSS:
The CSS required to create a parallax effect is actually pretty simple if you understand why it’s written the way it is. We first need to set the background image of the .bg div and then we need to stop the div from scrolling because the scroll action will be applied by jQuery; so we need to set its position to fixed. Next we set the width to 100% and the height to 300% to make sure the div is bigger than the actual screen. We position it at the top left and finally give it a z-index of -1 to make sure it is rendered underneath the text.
.bg { background: url('bg.jpg') repeat; position: fixed; width: 100%; height: 300%; top:0; left:0; z-index: -1; } This is all the CSS we need for the bg div, now we just need to style the rest of our page (although this is entirely optional, it doesn’t affect the parallax scroll):
section { color: #fff; font-family: arial; width: 500px; margin: auto; line-height: 20px; font-size: 16px; } Try scrolling the page now and you’ll see that the text scrolls but the background stays fixed, we’re going to change that with our jQuery:
What we want the jQuery to do is check how far the user has scrolled and move the background at a slower speed. We’re going to create a function called parallax and create a variable that will hold the value of the pixels the user has scrolled:
function parallax(){
var scrolled = $(window).scrollTop(); Now, to make the background scroll at the same speed as the text we set the top value of the div to be the negative value of the scroll, then close the function. Like so:
$('.bg').css('top', -(scrolled) + 'px');
} However the point of parallax scrolling is to move at a different speed, so to adjust the speed we multiply the value by a fraction, for example 0.2 for 20%:
function parallax(){
var scrolled = $(window).scrollTop();
$('.bg').css('top', -(scrolled * 0.2) + 'px');
} There’s just one more thing to do to get the effect running and that’s call the function every time the scroll event is triggered:
$(window).scroll(function(e){
parallax();
}); Having done this, our code is complete. If you test the file you’ll see it working. To change the speed, we need to change the fraction in the function; smaller fractions reduce the speed and higher fractions increase it. You can see the final result of this code in this pen I created.
As you can see creating a parallax effect isn’t as hard as you may have expected. Of course, this is just a simple example, but you can build on this to create any kind of complex parallax effect that you like.
Have you used a parallax effect in a project? Do you have a better method? Let us know in the comments.
Featured image/thumbnail, sliding perspective image via Shutterstock.
| 10 Fresh Responsive WordPress Themes – only $19! |  |
|
|
|
|
Researchers have launched a crowdfunding campaign for a propulsion system that could send loaf-sized satellites on interplanetary voyages.
A mini-satellite, no bigger than a loaf of bread, could push itself out of Earth’s orbit as soon as next year if a crowdfunding campaign to support development of a diminutive propulsion system succeeds. If such small spacecraft can be made to operate far from Earth, they could one day make inexpensive expeditions to asteroids, Mars, and beyond.
]]>Microsoft aims to simplify home automation with software that connects different Internet-enabled devices.
Researchers at Microsoft have released software aimed at making it easier for homes to be monitored, automated, and controlled using computers and the Internet. It also paves the way for developers to create apps that can be “installed” into homes with numerous different devices to make use of them in new ways.
]]>|
|