Guide to Planning Your Next Web Project

CommonPlaces e-Solutions
CommonPlaces e-SolutionsCommonPlaces e-Solutions
A Guide to Planning Your
Next Web Project
CommonPlaces’ Approach to Planning Successful Websites and
Web Applications



     commonplaces
               Strategy Creativity Technology



                                                Inside:
                                                Introduction ............................................. 2
                                                What Is Good Planning? ........................... 3
                                                Why Planning Is Worth It ......................... 4
                                                Site Functionality ..................................... 5
                                                Site Architecture Design .......................... 7
                                                Site Interface Design ............................... 8
                                                Technology Choices ................................. 9
                                                Bringing It All Together ........................... 11
                                                The QA Process - “Is This It?” ................. 12
                                                Summary and Next Steps ...................... 13
Introduction
            In the excitement of a new project, it’s easy to get so carried away that you
            want to begin work as soon as possible. But all too often, a lack of planning
            produces disappointing results.

            Perhaps before we talk about what makes for good planning, we should identify
            poor Web planning practices, so we can avoid them. The following should NOT
            be considered adequate documentation for your project:

            A napkin note. As romanticized as the idea may be, scribbled notes on a
            cocktail napkin will rarely produce a good final result – at least not quickly or
            efficiently. You may have captured the basic concepts, but there is no detail
            here.

            A list of websites you like. Though you may have a clear mental picture of the
            finished product, a list of sites you admire is much more likely to produce a
            Frankenstein than a cohesive website.

            A brief description of what you want your site to do. This is a good start, but
            it is only that - a start. The details are what will separate your website from the
            competition.




           © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                      2
What Is Good Planning?
           Now we know what isn’t good planning. But what is good planning? A complete
           planning phase to your project should consider the following:

           •     Site Functionality
           •     Site Interface Design
           •     Site Architecture
           •     Technology Choices

           Why is all this necessary?

           At first, you may find it
           hard to justify committing
           this amount of time and
           resources to your project
           before any development
           begins. But the benefits of thorough planning are clear, and more than justify
           the cost. We’ll explore these benefits in greater detail on the next page, and
           throughout this document.




          © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                   3
Why Planning Is Worth It
            As we so often tell our clients, there are numerous benefits to complete Web
            planning.

            First, we encourage clients to view planning as an investment, because it always
            saves time and money further down the line. Problems that could bring your
            project to a grinding halt can easily be avoided if they are spotted ahead of
            time.

            Planning also offers the opportunity to figure out exactly what you want your
            website to do and exactly how you want it to look – while your options are still
            wide open. Once you start to advance with the design and development of your
            site, you begin to limit yourself based on what has already been done. You may
            find yourself moving forward with a site you don’t even like, simply because you
            have already invested so much time and money into it.

            Lastly, planning helps by clearly conveying exactly what it is you DO want. You
            may have a clear picture of your future site in your mind, but unfortunately
            your developer is (probably) not a mind reader. If you dedicate the time to
            producing a clear and complete plan of your site, it will make it easy for your
            developer to build exactly what you want.




           © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                   4
Site Functionality
             Since you first decided to build or re-build your website, you’ve probably spent
             a lot of time thinking about what functionality you want your website to have.
             In other words, what you want your site to do.

             When deciding what your website will offer users, consider these questions:
             Who are your users? What are they looking for? It’s also important to decide
             on the key features of your site. What will make your site different from the
             competition? What are the key components that your site simply could not
             launch without? In the majority of cases, you may find it advantageous to
             launch your website with only the critical functionality in place. This way, you
             can build a loyal group of users who will facilitate word-of-mouth promotion,
             while you develop and add additional features based on user feedback.

             At this stage, you will also want to plan out the types of content that your site
             will include. This is an often ignored piece of the planning process, but it can
             be instrumental to getting what you envisioned. For example, your site might
             include blogs, news articles, podcasts, products, customer testimonials, etc.
             These are all slightly different types of content, and each has its own specific
             fields, views, and layouts. You should try to be as specific as possible regarding
             what differentiates these different types of content. As an example, though
             many blogs share similar traits, not all blogs look and act in the same way. So be
             specific!




            © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                     5
Site Functionality
             When communicating your plans to your developers, it is critical to be as clear,
             specific, and accurate as possible. The more detail you provide, the less chance
             there is that your developers will deviate from what you have in mind.

             Rather than saying “I want a blog,” give them all of the details.

             For example, I want a blog with:
             • Two authors (Frank and Sally)
             • Commenting by logged in users
             • Rating system (five stars)
             • An RSS feed
             • Links to share posts on social bookmarking sites
             • Five categories (News, Products, Events, etc.)
             • Each post and comment should include a user image (avatar)

             With a list like the one above, you have given your developers a checklist that
             they can use to create this portion of your site. All of the features above should
             also be reflected in your wireframes (see Page 8).




            © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                    6
Site Architecture Design
                                          How will your site be structured? The first step in this process should be to
                 Home
                                          create a complete site map. This will determine where every piece of content
                                          should exist within the structure of the site. The next step is to translate this
About     Products      Blog   Contact
                                          hierarchy effectively into site navigation.

History                                   Designing navigation involves many principles, including memory – for example,
                                          most people can only remember a list of seven things, so navigation with more
                                          options than this can be overwhelming. Navigation that is too many levels deep
                                          is also hard to manage for some users. When planning navigation, you’ll want
                                          to make sure you are grouping things intuitively into categories. Don’t use your
                                          company’s internal jargon to label menus and pages. Take the time to research
                                          the terminology that your users would employ.

                                          Ideally, you want to design a site that is so intuitive, it doesn’t even require
                                          instructions. With every piece of your site, ask yourself if it will help your users
                                          accomplish their goals (and your goals), or if it will be a hindrance. If this piece
                                          might represent a barrier to some users, remove or modify it.




                                         © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                       7
Site Interface Design
                                      Home    The next step in the process is to specify how your site should look.
                                              Unfortunately, this doesn’t just mean deciding on a blue or red background. It
                                              means designing a website that is engaging, easy-to-use, and yes, attractive as
                                              well.

                                              We often begin the design phase of a project by creating detailed, clickable
                                              wireframes of the site. This provides an opportunity to create a usable,
                                              organized interface, before worrying about visual design elements. Considering
                                              the decisions you’ve already made in the process (the features of your site,
                                              their relative importance, etc.), create a wireframe of your site that organizes
  About   Products   Blog   Contact           your content and functionality in a clear and sensible way.

                                              This process requires you to make decisions regarding the placement of
                                              elements on the page, their relative size and importance, their overall ease
                                              of use, and many other factors. Content should be arranged on the page so
                                              that users can easily scan through it. Use headings and lists to break up topics,
                                              include images, and be as concise as possible. Make sure you plan for a clear
                                              conversion path, with obvious calls to action.

                                              Lastly, it’s important to consider how search engines will move through your
                                              site, and plan for this in your design as well. Even if your site looks presentable
                                              to users, a disorganized underlying structure could hinder search engine spiders
                                              from crawling your site completely.



                                             © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                     8
Technology Choices
            What tools will you use to build your website? Today, many people turn
            to content management systems (CMS) because they are easy to use, and
            facilitate frequent content updates. With a user-friendly CMS at your disposal,
            there’s no need to wait for your IT person to make site updates for you. You can
            make changes when you want to make them.

            CommonPlaces develops exclusively with open source platforms. The reasons
            why we’ve chosen open source fill an entire white paper by themselves (you
            can download it here). But stated simply, we believe strongly in the open
            source model, and feel that if used by an experienced developer, it produces
            better results for a lower initial investment.

            Though we feel that open source is an easy choice to make, choosing which
            CMS is right for your project is not so easy. Each has its own unique strengths...
            and a community that stands behind it.

            Though CommonPlaces develops many projects in the
            Drupal CMS, we will always recommend using the best
            CMS for the task at hand, rather that attempting to fit a
            square peg in a round hole. If you would like to talk with
            our development experts regarding the right platform for
            your site, don’t hesitate to contact us.




           © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                    9
Technology Choices
            Community contributions are a large part of the open source model, and the
            open source platforms that we use at CommonPlaces are no exception to this
            rule. Platforms like Drupal and WordPress depend upon the development work
            of the community at large.

            This development work not only goes toward continually improving the core
            platforms themselves; it is also directed towards building optional pieces
            of functionality that are called modules, extensions, plug-ins, or add-ons,
            depending on the community. Regardless of what you call them, these pieces
            have the potential to provide much of the functionality you want, without the
            need to build it from scratch. In other words, you won’t have to reinvent the
            wheel for the purposes of your project.

            However, it is critical to assess the modules you will need before you begin
            development. Some may not be compatible with each other; others may not
            be frequently updated. This research should be done with the help of your
            development partner, who will have the experience with the platform and its
            community necessary to deliver appropriate recommendations.




           © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                10
Bringing It All Together
             At this point, most of your planning work is complete. The final step is to bring
             all of your work together and create one Project Specification, which you can
             hand over to your (very grateful) developers. Based on the work you have done,
             this “Spec” should include:

             •   Detailed descriptions of desired functionality and content types
             •   Site map
             •   Site wireframes
             •   Site designs
             •   A choice of platform/CMS
             •   A list of needed modules/extensions

             Whether you develop these pieces on your own, or take advantage of
             CommonPlaces’ complete Planning services, these document should create
             a very clear picture of your future site. This means that development will be
             faster, and the final result will be much closer to your initial intentions than if
             you handed your developers a couple of sketches on the back of a napkin.




            © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                       11
The QA Process - “Is This It?”
             The planning documents that you create will be of incredible value throughout
             the development process. However, they will prove themselves valuable again
             at the completion of your project, when the time comes for that critical but
             often ignored step - QA (quality assurance).

             If you have ever performed quality assurance on a large scale, you’ll know that
             it can be incredibly challenging. It requires great patience, concentration, and
             attention to detail. Fortunately, your planning documents will be there to help.

             At this stage, take out the planning documents you created, and use
             them as a checklist as you look at the finished product. Does it
             include all of the functionality you specified? Are the pages
             organized in the correct way? In the excitement of seeing
             your new website, it can be easy to overlook these
             small but critical details. Luckily, your planning
             specifications should include all of the functionality
             of your website, how it is supposed to work, and
             how your site is supposed to look. Use this as a
             blueprint as you move through your QA process.




            © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                  12
Summary and Next Steps
           Good planning keeps projects on time and on budget.

           A thorough planning phase also ensures that you get exactly what you were
           envisioning. One of the greatest challenges for Web developers is translating
           your “wants” and “needs” into a website. You can help your developer
           overcome this obstacle by clearly laying out what you want before development
           begins.

           In addition, planning documents are an incredibly valuable tool in the QA
           phase of your project. We advise all our clients to use them as a checklist,
           guaranteeing that every feature that was planned for appears accurately and
           completely in the final design.

           The planning experts at CommonPlaces love discussing the merits of project
           planning, and talking to people about their project ideas. If you would like to
           talk to someone about the planning details of your next project, feel free to
           contact us.

           Lastly, please share this document with others who would like to learn more
           about the benefits of incorporating a complete planning phase into their next
           web project.




          © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com                   13
1 von 13

Recomendados

The Web Design Summary.doc.doc von
The Web Design Summary.doc.docThe Web Design Summary.doc.doc
The Web Design Summary.doc.docbutest
4.3K views28 Folien
Taming Complexity: Drupal 8 UX von
Taming Complexity: Drupal 8 UXTaming Complexity: Drupal 8 UX
Taming Complexity: Drupal 8 UXWunderkraut
2.5K views72 Folien
Class 4: Introduction to web technology entrepreneurship von
Class 4: Introduction to web technology entrepreneurshipClass 4: Introduction to web technology entrepreneurship
Class 4: Introduction to web technology entrepreneurshipallanchao
752 views39 Folien
Designing with content-first von
Designing with content-firstDesigning with content-first
Designing with content-firstAndy Parker
1.2K views60 Folien
10 Principles Of Effective Web Design von
10 Principles Of Effective Web Design10 Principles Of Effective Web Design
10 Principles Of Effective Web Designsirferds
3.5K views35 Folien
Doors, Walls and Old Trees: Prioritizing to Get Simple von
Doors, Walls and Old Trees: Prioritizing to Get SimpleDoors, Walls and Old Trees: Prioritizing to Get Simple
Doors, Walls and Old Trees: Prioritizing to Get SimpleJason Ulaszek
83.9K views58 Folien

Más contenido relacionado

Was ist angesagt?

SampleBoard | Mood Board Creator Key Features von
SampleBoard | Mood Board Creator Key FeaturesSampleBoard | Mood Board Creator Key Features
SampleBoard | Mood Board Creator Key FeaturesSampleBoard
21.3K views23 Folien
Improving your site's usability - what users really want von
Improving your site's usability - what users really wantImproving your site's usability - what users really want
Improving your site's usability - what users really wantleisa reichelt
5.2K views87 Folien
ProductTank: What do UX people want from PMs and how can they best work toget... von
ProductTank: What do UX people want from PMs and how can they best work toget...ProductTank: What do UX people want from PMs and how can they best work toget...
ProductTank: What do UX people want from PMs and how can they best work toget...Mind the Product
23.8K views13 Folien
Web Design Trends 2017 von
Web Design Trends 2017Web Design Trends 2017
Web Design Trends 2017Lewis Lin 🦊
818 views66 Folien
Web Design Process - Tips & Guidelines von
Web Design Process - Tips & GuidelinesWeb Design Process - Tips & Guidelines
Web Design Process - Tips & GuidelinesAmanda Kern
1.8K views50 Folien
The building blocks of visual hierarchy von
The building blocks of visual hierarchyThe building blocks of visual hierarchy
The building blocks of visual hierarchyHalil Eren Çelik
1.3K views39 Folien

Was ist angesagt?(19)

SampleBoard | Mood Board Creator Key Features von SampleBoard
SampleBoard | Mood Board Creator Key FeaturesSampleBoard | Mood Board Creator Key Features
SampleBoard | Mood Board Creator Key Features
SampleBoard21.3K views
Improving your site's usability - what users really want von leisa reichelt
Improving your site's usability - what users really wantImproving your site's usability - what users really want
Improving your site's usability - what users really want
leisa reichelt5.2K views
ProductTank: What do UX people want from PMs and how can they best work toget... von Mind the Product
ProductTank: What do UX people want from PMs and how can they best work toget...ProductTank: What do UX people want from PMs and how can they best work toget...
ProductTank: What do UX people want from PMs and how can they best work toget...
Mind the Product23.8K views
Web Design Process - Tips & Guidelines von Amanda Kern
Web Design Process - Tips & GuidelinesWeb Design Process - Tips & Guidelines
Web Design Process - Tips & Guidelines
Amanda Kern1.8K views
The building blocks of visual hierarchy von Halil Eren Çelik
The building blocks of visual hierarchyThe building blocks of visual hierarchy
The building blocks of visual hierarchy
Halil Eren Çelik1.3K views
Running Great Design Reviews With Clients & Partners von Craig Peters
Running Great Design Reviews With Clients & PartnersRunning Great Design Reviews With Clients & Partners
Running Great Design Reviews With Clients & Partners
Craig Peters3.3K views
4 New Visually Creative Blogging Practices von opxmarketing
4 New Visually Creative Blogging Practices4 New Visually Creative Blogging Practices
4 New Visually Creative Blogging Practices
opxmarketing96 views
Cores and Paths - designing a website von Karen Lindemann
Cores and Paths - designing a websiteCores and Paths - designing a website
Cores and Paths - designing a website
Karen Lindemann1.4K views
What is UX, in 10 Slides von Jordan Julien
What is UX, in 10 SlidesWhat is UX, in 10 Slides
What is UX, in 10 Slides
Jordan Julien46.8K views
Evaluation - Question 3 von Mjames00
Evaluation - Question 3Evaluation - Question 3
Evaluation - Question 3
Mjames0019 views
Dennis Lee UX Portfolio von djae_lee
Dennis Lee UX PortfolioDennis Lee UX Portfolio
Dennis Lee UX Portfolio
djae_lee1.2K views
The definitive guide to Web flowcharts von FelixDing
The definitive guide to Web flowchartsThe definitive guide to Web flowcharts
The definitive guide to Web flowcharts
FelixDing48.7K views
Create free website von fullerhqim
Create free websiteCreate free website
Create free website
fullerhqim440 views
Kazumi Terada UX Portfolio 2016 von Kazumi Terada
Kazumi Terada UX Portfolio 2016Kazumi Terada UX Portfolio 2016
Kazumi Terada UX Portfolio 2016
Kazumi Terada3.4K views
Effectively Engaging Stakeholders in Drupal Projects von Julia Kulla-Mader
Effectively Engaging Stakeholders in Drupal ProjectsEffectively Engaging Stakeholders in Drupal Projects
Effectively Engaging Stakeholders in Drupal Projects
Julia Kulla-Mader1.5K views

Destacado

Junkyard von
JunkyardJunkyard
JunkyardHopeHeckman
300 views14 Folien
Junkyard von
JunkyardJunkyard
JunkyardHopeHeckman
197 views14 Folien
Animales Pedroo von
Animales PedrooAnimales Pedroo
Animales Pedrooguest9ee1c6
333 views11 Folien
Nourish In Depth von
Nourish  In DepthNourish  In Depth
Nourish In Depthguest40906a
186 views3 Folien
Thuiswinkelupdate 2009 von
Thuiswinkelupdate 2009Thuiswinkelupdate 2009
Thuiswinkelupdate 2009Alon Ben Joseph
216 views19 Folien
Overview Of Astronomy von
Overview Of AstronomyOverview Of Astronomy
Overview Of Astronomyguestfc4a02
410 views11 Folien

Destacado(20)

Overview Of Astronomy von guestfc4a02
Overview Of AstronomyOverview Of Astronomy
Overview Of Astronomy
guestfc4a02410 views
PHP, Cloud And Microsoft Symfony Live 2010 von guest5a7126
PHP,  Cloud And  Microsoft    Symfony  Live 2010PHP,  Cloud And  Microsoft    Symfony  Live 2010
PHP, Cloud And Microsoft Symfony Live 2010
guest5a71262.5K views
Edlt528 group3 vision_learningproject von Tracey Lofton
Edlt528 group3 vision_learningprojectEdlt528 group3 vision_learningproject
Edlt528 group3 vision_learningproject
Tracey Lofton373 views
Semana cultural von cuestaines
Semana culturalSemana cultural
Semana cultural
cuestaines279 views
Kinder Poems von santaana1
Kinder PoemsKinder Poems
Kinder Poems
santaana1282 views

Similar a Guide to Planning Your Next Web Project

12 Phases of Web Development Life Cycle von
12 Phases of Web Development Life Cycle12 Phases of Web Development Life Cycle
12 Phases of Web Development Life CycleNCode Technologies Inc.
1.3K views8 Folien
The Website Redesign Process von
The Website Redesign ProcessThe Website Redesign Process
The Website Redesign ProcessGary Schroeder
11.3K views11 Folien
How to make a great website von
How to make a great websiteHow to make a great website
How to make a great websiteDr. Taher Ghazal
516 views17 Folien
Java Unit 5(part 1) von
Java Unit 5(part 1)Java Unit 5(part 1)
Java Unit 5(part 1)SURBHI SAROHA
520 views15 Folien
T2L3.doc von
T2L3.docT2L3.doc
T2L3.docbutest
294 views19 Folien

Similar a Guide to Planning Your Next Web Project(20)

The Website Redesign Process von Gary Schroeder
The Website Redesign ProcessThe Website Redesign Process
The Website Redesign Process
Gary Schroeder11.3K views
T2L3.doc von butest
T2L3.docT2L3.doc
T2L3.doc
butest294 views
Carl week 5 dont make me think pp von wendyr1974
Carl week 5 dont make me think ppCarl week 5 dont make me think pp
Carl week 5 dont make me think pp
wendyr1974106 views
Bootstrap 4 Online Training Course Book Sample von Bootstrap Creative
Bootstrap 4 Online Training Course Book SampleBootstrap 4 Online Training Course Book Sample
Bootstrap 4 Online Training Course Book Sample
Bootstrap Creative570 views
Carl week 5 dont make me think part 2 pp von wendyr1974
Carl week 5 dont make me think part 2 ppCarl week 5 dont make me think part 2 pp
Carl week 5 dont make me think part 2 pp
wendyr1974145 views
Carl week 5 dont make me think part 2 pp von wendyr1974
Carl week 5 dont make me think part 2 ppCarl week 5 dont make me think part 2 pp
Carl week 5 dont make me think part 2 pp
wendyr1974109 views
Website Development Explained (abriged from "The Website Manager's Handbook") von Shane Diffily
Website Development Explained (abriged from "The Website Manager's Handbook")Website Development Explained (abriged from "The Website Manager's Handbook")
Website Development Explained (abriged from "The Website Manager's Handbook")
Shane Diffily4K views
TechOut_Generalized Workflow von Kabeed Mansur
TechOut_Generalized WorkflowTechOut_Generalized Workflow
TechOut_Generalized Workflow
Kabeed Mansur168 views
7 Important Guidelines for Effective Responsive Web Design von Proweaver, Inc
7 Important Guidelines for Effective Responsive Web Design7 Important Guidelines for Effective Responsive Web Design
7 Important Guidelines for Effective Responsive Web Design
Proweaver, Inc17 views
Introducing Communication Sites for Communicators #spfestchi #CM101 von Kanwal Khipple
Introducing Communication Sites for Communicators #spfestchi #CM101Introducing Communication Sites for Communicators #spfestchi #CM101
Introducing Communication Sites for Communicators #spfestchi #CM101
Kanwal Khipple453 views
Design Process | Tool 02: Scenario - Tool 03: Wireframe von Gessica Puri
Design Process | Tool 02: Scenario - Tool 03: WireframeDesign Process | Tool 02: Scenario - Tool 03: Wireframe
Design Process | Tool 02: Scenario - Tool 03: Wireframe
Gessica Puri542 views
Good vs Evil SharePoint Customizing von Stacy Deere
Good vs Evil SharePoint CustomizingGood vs Evil SharePoint Customizing
Good vs Evil SharePoint Customizing
Stacy Deere848 views
Université Laval - Analyste d'affaires - agence affaires électroniques - Alai... von Alain Fortier
Université Laval - Analyste d'affaires - agence affaires électroniques - Alai...Université Laval - Analyste d'affaires - agence affaires électroniques - Alai...
Université Laval - Analyste d'affaires - agence affaires électroniques - Alai...
Alain Fortier916 views
Web Design by Client Perspective von eginni
 Web Design by Client Perspective Web Design by Client Perspective
Web Design by Client Perspective
eginni743 views
The Essential Guide to Web Planning von Serious SEM
The Essential Guide to Web PlanningThe Essential Guide to Web Planning
The Essential Guide to Web Planning
Serious SEM317 views

Último

Vertical User Stories von
Vertical User StoriesVertical User Stories
Vertical User StoriesMoisés Armani Ramírez
12 views16 Folien
PharoJS - Zürich Smalltalk Group Meetup November 2023 von
PharoJS - Zürich Smalltalk Group Meetup November 2023PharoJS - Zürich Smalltalk Group Meetup November 2023
PharoJS - Zürich Smalltalk Group Meetup November 2023Noury Bouraqadi
126 views17 Folien
The details of description: Techniques, tips, and tangents on alternative tex... von
The details of description: Techniques, tips, and tangents on alternative tex...The details of description: Techniques, tips, and tangents on alternative tex...
The details of description: Techniques, tips, and tangents on alternative tex...BookNet Canada
126 views24 Folien
Unit 1_Lecture 2_Physical Design of IoT.pdf von
Unit 1_Lecture 2_Physical Design of IoT.pdfUnit 1_Lecture 2_Physical Design of IoT.pdf
Unit 1_Lecture 2_Physical Design of IoT.pdfStephenTec
12 views36 Folien
Democratising digital commerce in India-Report von
Democratising digital commerce in India-ReportDemocratising digital commerce in India-Report
Democratising digital commerce in India-ReportKapil Khandelwal (KK)
15 views161 Folien
Piloting & Scaling Successfully With Microsoft Viva von
Piloting & Scaling Successfully With Microsoft VivaPiloting & Scaling Successfully With Microsoft Viva
Piloting & Scaling Successfully With Microsoft VivaRichard Harbridge
12 views160 Folien

Último(20)

PharoJS - Zürich Smalltalk Group Meetup November 2023 von Noury Bouraqadi
PharoJS - Zürich Smalltalk Group Meetup November 2023PharoJS - Zürich Smalltalk Group Meetup November 2023
PharoJS - Zürich Smalltalk Group Meetup November 2023
Noury Bouraqadi126 views
The details of description: Techniques, tips, and tangents on alternative tex... von BookNet Canada
The details of description: Techniques, tips, and tangents on alternative tex...The details of description: Techniques, tips, and tangents on alternative tex...
The details of description: Techniques, tips, and tangents on alternative tex...
BookNet Canada126 views
Unit 1_Lecture 2_Physical Design of IoT.pdf von StephenTec
Unit 1_Lecture 2_Physical Design of IoT.pdfUnit 1_Lecture 2_Physical Design of IoT.pdf
Unit 1_Lecture 2_Physical Design of IoT.pdf
StephenTec12 views
Piloting & Scaling Successfully With Microsoft Viva von Richard Harbridge
Piloting & Scaling Successfully With Microsoft VivaPiloting & Scaling Successfully With Microsoft Viva
Piloting & Scaling Successfully With Microsoft Viva
handbook for web 3 adoption.pdf von Liveplex
handbook for web 3 adoption.pdfhandbook for web 3 adoption.pdf
handbook for web 3 adoption.pdf
Liveplex22 views
Case Study Copenhagen Energy and Business Central.pdf von Aitana
Case Study Copenhagen Energy and Business Central.pdfCase Study Copenhagen Energy and Business Central.pdf
Case Study Copenhagen Energy and Business Central.pdf
Aitana16 views
iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas... von Bernd Ruecker
iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas...iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas...
iSAQB Software Architecture Gathering 2023: How Process Orchestration Increas...
Bernd Ruecker33 views
TouchLog: Finger Micro Gesture Recognition Using Photo-Reflective Sensors von sugiuralab
TouchLog: Finger Micro Gesture Recognition  Using Photo-Reflective SensorsTouchLog: Finger Micro Gesture Recognition  Using Photo-Reflective Sensors
TouchLog: Finger Micro Gesture Recognition Using Photo-Reflective Sensors
sugiuralab19 views
Igniting Next Level Productivity with AI-Infused Data Integration Workflows von Safe Software
Igniting Next Level Productivity with AI-Infused Data Integration Workflows Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Igniting Next Level Productivity with AI-Infused Data Integration Workflows
Safe Software257 views
Attacking IoT Devices from a Web Perspective - Linux Day von Simone Onofri
Attacking IoT Devices from a Web Perspective - Linux Day Attacking IoT Devices from a Web Perspective - Linux Day
Attacking IoT Devices from a Web Perspective - Linux Day
Simone Onofri15 views
Transcript: The Details of Description Techniques tips and tangents on altern... von BookNet Canada
Transcript: The Details of Description Techniques tips and tangents on altern...Transcript: The Details of Description Techniques tips and tangents on altern...
Transcript: The Details of Description Techniques tips and tangents on altern...
BookNet Canada135 views

Guide to Planning Your Next Web Project

  • 1. A Guide to Planning Your Next Web Project CommonPlaces’ Approach to Planning Successful Websites and Web Applications commonplaces Strategy Creativity Technology Inside: Introduction ............................................. 2 What Is Good Planning? ........................... 3 Why Planning Is Worth It ......................... 4 Site Functionality ..................................... 5 Site Architecture Design .......................... 7 Site Interface Design ............................... 8 Technology Choices ................................. 9 Bringing It All Together ........................... 11 The QA Process - “Is This It?” ................. 12 Summary and Next Steps ...................... 13
  • 2. Introduction In the excitement of a new project, it’s easy to get so carried away that you want to begin work as soon as possible. But all too often, a lack of planning produces disappointing results. Perhaps before we talk about what makes for good planning, we should identify poor Web planning practices, so we can avoid them. The following should NOT be considered adequate documentation for your project: A napkin note. As romanticized as the idea may be, scribbled notes on a cocktail napkin will rarely produce a good final result – at least not quickly or efficiently. You may have captured the basic concepts, but there is no detail here. A list of websites you like. Though you may have a clear mental picture of the finished product, a list of sites you admire is much more likely to produce a Frankenstein than a cohesive website. A brief description of what you want your site to do. This is a good start, but it is only that - a start. The details are what will separate your website from the competition. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 2
  • 3. What Is Good Planning? Now we know what isn’t good planning. But what is good planning? A complete planning phase to your project should consider the following: • Site Functionality • Site Interface Design • Site Architecture • Technology Choices Why is all this necessary? At first, you may find it hard to justify committing this amount of time and resources to your project before any development begins. But the benefits of thorough planning are clear, and more than justify the cost. We’ll explore these benefits in greater detail on the next page, and throughout this document. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 3
  • 4. Why Planning Is Worth It As we so often tell our clients, there are numerous benefits to complete Web planning. First, we encourage clients to view planning as an investment, because it always saves time and money further down the line. Problems that could bring your project to a grinding halt can easily be avoided if they are spotted ahead of time. Planning also offers the opportunity to figure out exactly what you want your website to do and exactly how you want it to look – while your options are still wide open. Once you start to advance with the design and development of your site, you begin to limit yourself based on what has already been done. You may find yourself moving forward with a site you don’t even like, simply because you have already invested so much time and money into it. Lastly, planning helps by clearly conveying exactly what it is you DO want. You may have a clear picture of your future site in your mind, but unfortunately your developer is (probably) not a mind reader. If you dedicate the time to producing a clear and complete plan of your site, it will make it easy for your developer to build exactly what you want. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 4
  • 5. Site Functionality Since you first decided to build or re-build your website, you’ve probably spent a lot of time thinking about what functionality you want your website to have. In other words, what you want your site to do. When deciding what your website will offer users, consider these questions: Who are your users? What are they looking for? It’s also important to decide on the key features of your site. What will make your site different from the competition? What are the key components that your site simply could not launch without? In the majority of cases, you may find it advantageous to launch your website with only the critical functionality in place. This way, you can build a loyal group of users who will facilitate word-of-mouth promotion, while you develop and add additional features based on user feedback. At this stage, you will also want to plan out the types of content that your site will include. This is an often ignored piece of the planning process, but it can be instrumental to getting what you envisioned. For example, your site might include blogs, news articles, podcasts, products, customer testimonials, etc. These are all slightly different types of content, and each has its own specific fields, views, and layouts. You should try to be as specific as possible regarding what differentiates these different types of content. As an example, though many blogs share similar traits, not all blogs look and act in the same way. So be specific! © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 5
  • 6. Site Functionality When communicating your plans to your developers, it is critical to be as clear, specific, and accurate as possible. The more detail you provide, the less chance there is that your developers will deviate from what you have in mind. Rather than saying “I want a blog,” give them all of the details. For example, I want a blog with: • Two authors (Frank and Sally) • Commenting by logged in users • Rating system (five stars) • An RSS feed • Links to share posts on social bookmarking sites • Five categories (News, Products, Events, etc.) • Each post and comment should include a user image (avatar) With a list like the one above, you have given your developers a checklist that they can use to create this portion of your site. All of the features above should also be reflected in your wireframes (see Page 8). © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 6
  • 7. Site Architecture Design How will your site be structured? The first step in this process should be to Home create a complete site map. This will determine where every piece of content should exist within the structure of the site. The next step is to translate this About Products Blog Contact hierarchy effectively into site navigation. History Designing navigation involves many principles, including memory – for example, most people can only remember a list of seven things, so navigation with more options than this can be overwhelming. Navigation that is too many levels deep is also hard to manage for some users. When planning navigation, you’ll want to make sure you are grouping things intuitively into categories. Don’t use your company’s internal jargon to label menus and pages. Take the time to research the terminology that your users would employ. Ideally, you want to design a site that is so intuitive, it doesn’t even require instructions. With every piece of your site, ask yourself if it will help your users accomplish their goals (and your goals), or if it will be a hindrance. If this piece might represent a barrier to some users, remove or modify it. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 7
  • 8. Site Interface Design Home The next step in the process is to specify how your site should look. Unfortunately, this doesn’t just mean deciding on a blue or red background. It means designing a website that is engaging, easy-to-use, and yes, attractive as well. We often begin the design phase of a project by creating detailed, clickable wireframes of the site. This provides an opportunity to create a usable, organized interface, before worrying about visual design elements. Considering the decisions you’ve already made in the process (the features of your site, their relative importance, etc.), create a wireframe of your site that organizes About Products Blog Contact your content and functionality in a clear and sensible way. This process requires you to make decisions regarding the placement of elements on the page, their relative size and importance, their overall ease of use, and many other factors. Content should be arranged on the page so that users can easily scan through it. Use headings and lists to break up topics, include images, and be as concise as possible. Make sure you plan for a clear conversion path, with obvious calls to action. Lastly, it’s important to consider how search engines will move through your site, and plan for this in your design as well. Even if your site looks presentable to users, a disorganized underlying structure could hinder search engine spiders from crawling your site completely. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 8
  • 9. Technology Choices What tools will you use to build your website? Today, many people turn to content management systems (CMS) because they are easy to use, and facilitate frequent content updates. With a user-friendly CMS at your disposal, there’s no need to wait for your IT person to make site updates for you. You can make changes when you want to make them. CommonPlaces develops exclusively with open source platforms. The reasons why we’ve chosen open source fill an entire white paper by themselves (you can download it here). But stated simply, we believe strongly in the open source model, and feel that if used by an experienced developer, it produces better results for a lower initial investment. Though we feel that open source is an easy choice to make, choosing which CMS is right for your project is not so easy. Each has its own unique strengths... and a community that stands behind it. Though CommonPlaces develops many projects in the Drupal CMS, we will always recommend using the best CMS for the task at hand, rather that attempting to fit a square peg in a round hole. If you would like to talk with our development experts regarding the right platform for your site, don’t hesitate to contact us. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 9
  • 10. Technology Choices Community contributions are a large part of the open source model, and the open source platforms that we use at CommonPlaces are no exception to this rule. Platforms like Drupal and WordPress depend upon the development work of the community at large. This development work not only goes toward continually improving the core platforms themselves; it is also directed towards building optional pieces of functionality that are called modules, extensions, plug-ins, or add-ons, depending on the community. Regardless of what you call them, these pieces have the potential to provide much of the functionality you want, without the need to build it from scratch. In other words, you won’t have to reinvent the wheel for the purposes of your project. However, it is critical to assess the modules you will need before you begin development. Some may not be compatible with each other; others may not be frequently updated. This research should be done with the help of your development partner, who will have the experience with the platform and its community necessary to deliver appropriate recommendations. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 10
  • 11. Bringing It All Together At this point, most of your planning work is complete. The final step is to bring all of your work together and create one Project Specification, which you can hand over to your (very grateful) developers. Based on the work you have done, this “Spec” should include: • Detailed descriptions of desired functionality and content types • Site map • Site wireframes • Site designs • A choice of platform/CMS • A list of needed modules/extensions Whether you develop these pieces on your own, or take advantage of CommonPlaces’ complete Planning services, these document should create a very clear picture of your future site. This means that development will be faster, and the final result will be much closer to your initial intentions than if you handed your developers a couple of sketches on the back of a napkin. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 11
  • 12. The QA Process - “Is This It?” The planning documents that you create will be of incredible value throughout the development process. However, they will prove themselves valuable again at the completion of your project, when the time comes for that critical but often ignored step - QA (quality assurance). If you have ever performed quality assurance on a large scale, you’ll know that it can be incredibly challenging. It requires great patience, concentration, and attention to detail. Fortunately, your planning documents will be there to help. At this stage, take out the planning documents you created, and use them as a checklist as you look at the finished product. Does it include all of the functionality you specified? Are the pages organized in the correct way? In the excitement of seeing your new website, it can be easy to overlook these small but critical details. Luckily, your planning specifications should include all of the functionality of your website, how it is supposed to work, and how your site is supposed to look. Use this as a blueprint as you move through your QA process. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 12
  • 13. Summary and Next Steps Good planning keeps projects on time and on budget. A thorough planning phase also ensures that you get exactly what you were envisioning. One of the greatest challenges for Web developers is translating your “wants” and “needs” into a website. You can help your developer overcome this obstacle by clearly laying out what you want before development begins. In addition, planning documents are an incredibly valuable tool in the QA phase of your project. We advise all our clients to use them as a checklist, guaranteeing that every feature that was planned for appears accurately and completely in the final design. The planning experts at CommonPlaces love discussing the merits of project planning, and talking to people about their project ideas. If you would like to talk to someone about the planning details of your next project, feel free to contact us. Lastly, please share this document with others who would like to learn more about the benefits of incorporating a complete planning phase into their next web project. © 2010 CommonPlaces e-Solutions, LLC | www.CommonPlaces.com 13