Maybe its a payment system for your online greeting card service, or a spell checker component for your realtime note editor, you would rather look for something that’s already built and working well rather than building it yourself from scratch. This way you can focus on your “core competency”.

This is generally how everyone thinks. So did we. Here at Creately, we chose to use a third party solution to complete a product that we were working on. In the rush and excitement of getting the product out we signed up with the 3rd party service not considering some important factors that we should have. Even though the intention was to avoid reinventing the wheel and save time and effort, the out come was us spending double the time and effort to get the solution to work. Lesson learnt the hard way.

So I thought I would put together a simple flowchart to help us evaluate such situations in the future when such a need arises again. This flow chart explains the basic thinking, and the factors involved in making the decision can be found below.

Picking the most suitable solution

• How well is my requirement met? Does the solution meet all the feature and functionality requirements I have? Does the solution meet the integration requirements I have?
• Is the component build for me? Even if the solution meets all my functionality and feature requirements, one thing I have to watch out for is, if it does more than what I need. Will it complicate my product? or my users experience? or my integration process?
• Is the integration and setup process straight forward? Time and effort required to setup and integrate?
• What is the financial commitment?
• Considering all factors above, compare the time, effort and cost involved in building the ideal solution against using the selected solution.

Assessing if the solution can be used to solve the problem

• Can I use the existing features in the solution to make it do what I want it to do?
• Can the solution be customized to fit my requirements?
• What is the time and effort involved in customizing the solution for my need?
• What is the financial cost involved in customizing the solution for my need?
• Considering all factors above in A and B, compare the time, effort and cost involved in building the ideal solution against using the selected solution.

@Hiraash

You’ve got traffic?

We normally use funnel diagrams to understand the flow of a user through our website, to the application, and then onto the purchase pages (or not). Some great tools are out there and just last week @Indu blogged about using Funnels & Goals in Google Analytics to better understand your funnel and conversion rates.

This week, we went and applied the same to our traffic funnel in three steps.

• Identify how our potential customers find out about Creately. The ‘trigger’ to visit the site.
• What their motivations are. Why are they here?
• Identify the pages they land on, and craft a message that resonates with the visitor’s intent and motivations. This will achieve lower bounce rates and far better conversions in a funnel.

Ok, again: Being relevant is key. but how do we know what’s relevant unless we know what you want?

Map it out!

It’s easier to map this out in a diagram, and here’s ours - How People Discover Creately. Some of the bounce rates are guesstimates though.

We first identified the source for them to come to Creately, then we break them down by their motivations and where they would go on the site to what landing pages.

The next phase is to make sure the landing pages speak to them well and address their questions. That’s another post for another day

Before I go back to more diagramming and numbers, do you find this approach useful? How do you look at your traffic funnel?

@Chandika

Image By: vrogy / CC3.0

We’ve mentioned the importance of Map Overlay in the first post, and this time its all about Goals in Google Analytics! Lets see what Goals are, why they’re important and how we set them.

What are Goals in Google Analytics?

Goals describe the completion of a desired task that you’d like your visitors to do!

By setting up Goals in Google Analytics, you can measure how often the desired tasks are completed, and this is called the conversion rate.

Before implementing Goals, identify what your website’s objectives are, and what visitor actions they correspond to. A goal can be anything from completing a contact form for generating leads to completing a purchase for driving revenue.

For example, in Creately, one of the Goals is a visitor signing up for our online diagramming service.

There are multiple ways to define goals, and here’s a great article written by Ian Spencer that gives more tips on Goals in Google Analytics.

And now, the Goal Funnel?

Accomplishing a Goal involves a sequence of steps. The sequence that leads up to the completion of a Goal make up the Goal Funnel. For each Goal, you will need to setup a Goal Funnel and like the Goal itself, each of these steps must correspond to a measurable action on a specific page.

For example, Creately visitors go through a sequence of steps before finally performing the desired Sign Up action. Assume that you land on the Creately UML Landing page (the first step towards the Goal), where you might choose to Try Creately Now without signing up, and then from the Creately application you could opt to Sign Up ‘cos you’re convinced.

This would direct you to the Plans & Pricing page, where you’d be expected to choose a preferred plan, then click on Sign Up to make the purchase. Once you complete the purchase, you’d be sent to the Thank you page (this marks the Goal). Now, this means the desired task is performed and the Goal is accomplished.

However, on the other hand if the website visitor only goes up to the plans page, and opts to leave without signing up. Then the Goal is not met and it’s considered to be abandoned! Thus, Goals and Conversion rates are important to measure the performance of a website.

We refer to the whole sequential process as a funnel - many people start at the top and fewer end up coming out to the bottom by accomplishing the Goal.

Check out the flowchart below to see the steps that correspond to a measurable action on different pages -

How to Set up Goals

Setting a goal is very simple. If you have administrative access, you can sign in to your Google Analytics. Then go to Analytics Settings and select a profile, click on edit, choose an unused goal ’slot’, and click on edit again.

You’ll need to then follow the steps and decide what your goal is and how you’ll be declaring a goal, then click to finish and you’ll start measuring the performance for your website.

Check out this video for more details on Setting Up Goals in Google Analytics

This week’s release at a glance!

1) Better Diagram  Manager

Multi-Select and new Keyboard Shortcuts

We’ve made it possible for you to multi-select all the diagrams in your Creately Projects. You can now select multiple diagrams to either open or delete them, saving you loads of time while working in Creately. To make it easier, we’ve introduced a couple of useful keyboard shortcuts - To select all the diagrams in a project, simply click Ctrl + A or hit click F2 to rename a diagram/document from the Document Manager window.

Check out the new Sort and Filter options!

Do you spend a whole lot of your time locating the diagrams in your Creately Projects? Click on the drop down menu on the Sort and Filter options to locate your diagrams in your Projects. With the improved filter options you can locate your diagrams in just minutes.

3) Pretty shapes and connectors!

All your abstract shapes come with a default fill! We’ve decided to lose the plain boring white fills in our abstract shapes, and now they’re all with pretty gradient fills. We’ve not stopped with there, we’ve also tuned the Flowchart object connection points for beautiful looking flowcharts; and created thinner outlines on all the User Interface objects to give it a more uniform look.

We’ve introduced a faster JPEG encoder to make exporting JPEG significantly faster, along with better error management and recovery on Network and Session issues all to keep our valuable users happy!

Over the next few weeks we will be looking at how we use Sitemaps, User Flows, Use Cases, User Stories, Wireframes and more in delivering an effective website / software product to a client. It’s a lot to cover, and do let us know if you have more ideas at blogs@creately.com

Sitemaps

When kicking off a project its always important to settle on a content structure for the site. While some argue the sitemap is a dated artifact now as content linking happens in many ways, we believe it is really useful when used right.

It’s a great tool to help visualize how the site is broken up, what the main pages are going to be, and where in the content hierarchy they belong. We definitely think its an important tool to use in a project to bring more clarity and consensus.

When to use

1. Creating a new site:

Use it to identify broad content areas, sub sections and a conceptual structure for the site.

2. Updating an existing site / redesign -

Go through the site and generate a map. We recommend against typical ’sitemap generators’ as they pick out all links to create the structure. Not all links are made equal!

By documenting what’s in the site now, you can start curating the content

Guiding principles

1. The site map is a organization and a planning tool. It is usually not the final outcome of the site. Use it not only to identify main areas of the site, but also page types, templates that go with them, secure/ non-secure pages etc.

2. Quickly agree on the first version of the site map and keep revisiting through out the project. Use it as a top-level view to identify what has been completed on the project, what high level decisions were made etc.

Best Practices for Sitemaps

1. Brainstorm first. The best way to do a sitemap is actually NOT to start with a sitemap. Try working on a mindmap with your client and the team. It will be a natural structure for you to capture all the ideas, then start grouping them together.

2. Identify the main content areas and their page breakdowns.

Content headlines, subsection headings should be recorded by this time. A good idea would be to record them right in the document itself.

The earlier you get this done, the clearer your clients and teams understanding of the project.

3. Mark out pages that include special functionality.

Got some pages that need to be loaded securely? some with forms? some featuring video content? mark them out in the sitemap itself.

4. Identify design variations.

Some pages in the site / app may have different theme’s or design elements. Color them differently to identify groups of these pages easily.

5. Keep it ‘Alive’

Review and revisit the site map as your understanding of the project changes. New pages, changed structure, new names; doing the simple updates to keep the document up-to date will ensure that you’ll have less confusion in your team and happier clients.

6. A High level view

Use the site map as a high level view to the project. You can link the user flows, wireframes and other documents you create on to the pages to keep track of progress and to provide a unified view to your client and team.

So how do you use Sitemaps in your projects?

@Chandika

The Approach

Taking the current version of Creately that was built as a SAAS service and turning it into a portable component that works on any platform was quite a lot of fun and somewhat challenging. When we designed the Creately Plugin we had to make sure it could be easily reused and quickly integrated into any platform out there. This way Creately can be made available on your favorite wikis, blogs, case management and productivity tools in the near future with minimal rework.

Creately SWF & Wrapper

Basically, there are two parts to converting an online application like Creately to support a plugin infrastrusture. The first is the the actual application, Creately, that can be compiled in 2 different modes. The Online SWF Mode for SAAS delivery and the Plugin SWF Mode for integrating into plugin platforms.

The second component, the Plugin Wrapper, is responsible for integrating the application into the platform that hosts the plugin. This Plugin Wrapper needs to be built specifically for the platform that it is hosted on, using the platform’s API’s. Platforms like FogBugz have detailed documentation on how a plugin can be built for it. In the case of FogBugz, we also had the folks at FogCreek helping us get the best diagramming plugin out to you guys. Thanks, we couldn’t have done it without you guys.

Deconstructing the Application

So we started with the most important component, the Creately SWF, the flex code that runs in the Flash Player in your browser. We worked in a layer of separation to enable us to compile the Creately SWF to run in different modes. Based on the mode, the Creately front end functionality and the backend interaction would work completely differently. The mode is specified in a configuration file that is used when compiling Creately.

The Online Mode SWF uses Remote Objects to connect and interact with the Creately backend services (Jupiter Service). The Plugin Mode SWF would expect a set of http endpoints to be available for it to communicate, to send and receive the required data. The Plugin Wrapper would expose these endpoints required by the Plugin Mode SWF and are configured in the configuration file.

This way by simply switching the configuration file and compiling, the Creately swf can be used to either generate Creately to run as a SaaS service or as a FogBugz plugin or a plugin for a completely new platform. This method not only enables us to easily build Creately plugins for more platforms but also lets us deliver all the cool new features we build into Creately to all distributions of Creately. Its great to be able to do this without ever splitting our code base.

More Ideas!

You think thats cool? Well then you are going to like what I have to say next. This very approach will enable us to build a desktop version of Creately for you in the future. How about that?

Tell us what you think and how much you like the idea of Creately on your desktop. Also, if there’s another platform out there you’d love to see Creately on drop leave us a note here.

@Hiraash

Header Image by Jake Mates / CC BY-NC-ND 2.0

Faster Creately

We’re very excited about the new version. With Flash 10.1, Creately now runs blazingly fast on the Mac (and on PC’s), is overall delivers a more stable and reliable experience. Adobe has thankfully fixed a number of issues that have plagued our loyal customers since the last version, including issues with image uploading on the Mac.

To achieve this performance improvements, Flash 10.1 supports hardware acceleration of 2D and 3D graphics, manages memory more efficiently especially in tabbed browsing situations and includes a number of core improvements to the run-time to reduce execution time.

The Future of Flash

Creately for FogBugz lets everyone on your project team communicate clearly by easily creating and including diagrams in FogBugz. With full integration into the FogBugz interface, you can easily add Use Cases, Wireframes, Flowcharts, UML or any other diagrams to FogBugz cases and wiki pages.

Squash’Em Bugs

Bugs fixing will go a lot smoother when you can clearly explain the issues to developers. As they say, a picture is worth a thousand words, so get everyone on the same page by adding annotated wireframes, or updated Use Cases to every FogBugz case. Anyone working on the case can edit and and modify diagrams as the case or feature is worked on.

Up-to-date Documentation

The ability to quickly add diagrams directly within Wiki pages will make documenting your software projects a lot less of a chore. No more attaching external Visio files, and no more expensive desktop-based software. With Creately for FogBugz, the whole team can update project documentation right within the browser, saving time and more importantly helping keep your specifications up-to-date.

Get it now!

Creately for FogBugz plugin is available for installation on your own Fogbugz server starting from $85/user with bulk discounts available for larger teams. Currently we only support Fogbugz on the Windows platform,  but a Linux and hosted version for FogBugz OnDemand will be announced shortly.

Download Free 14-day trial

Installation Help

Give yourself the advantage of Creately for Fogbugz by purchasing your license right now or if your not quite ready you can also download the free 14-day trial.

Save your Diagrams Locally

First off, the new Import/Export capability. Team and Pro users can now backup all your Creately diagrams locally on your desktop by simply exporting a Creately Document Markup Language format file (*.cdml). These exported files can easily be imported back into Creately maintaining all embedded images and links at full-resolution.

We’ve significantly upgraded our upload and download infrastructure, so now you’ll be able to download CDML, PDF, PNG and JPEGs as well as import your own graphics into Creately at a blistering speed. This is great for all those mockups and presentations that need custom graphics. We know you’ll love this.

We’re most excited about the possibilities the new CDML format will present for our users and developers, so over the next few weeks , Hiraash will be putting up some ideas and examples of what you can do with our new diagram document format. Go ahead, export an image and open the CDML file with any text editor for a sneak peek.

Bulk User Plans!

After we announced our Team plans and Creately for Google Apps, we’ve been inunadated with requests from larger Teams looking to adopt Creately in their pursuit for more efficient project collaboration. We’ve heard you and we’re happy to announce fantastic bulk discounts for larger Teams.

With the new prices, you’ll pay $8/month each for the first 5 users. If you have a larger team of say 12 users, you’ll simply pay $8 for the first 5 users, then $6 for the next 5 and finally $5 for the last 2 users. So a 12 user team will be charged $80 / month ($40 + $30 + $10). That’s a 17% savings, straight off the bat.

Check out our plans page for more details. If you need more than a 100 users on Creately - call us we’re here to help.

These new discounts will make adopting Creately across your Google Apps domain excellent value for money. As always, we’ve got great discounts for Educators, Colleges and do-gooders - just reach out to us.

What to Expect

Over the coming weeks - expect some exciting new announcements that will Creately the best visual collaboration and diagramming application for software, design and support teams, including a new plugin for FogBugz and improvements in our software diagramming capability. Until then happy diagramming.

@Creately Team

Here at Cinergix we’ve been working together from different office locations around the world to create, market and support the best online diagramming software - Creately. We spend hours sitting in front of our computers each day working across vast distances and timezones and it can sometimes be a challenge getting everyone on the team working together effectively.

So over the last year, we’ve experimented with a large number of online services to help us work better and support our customers in the best possible way. In each solution we looked for just the right amount of functionality to help us work better without drowning in too much process and too many systems.

Here we’ve distilled the top 5 tools (mostly online tools) that we’ve come to rely on to keep the Creately engine chugging along nicely. They cover everything from project management tools to customer support systems, but each one offers the ease of use and simplicity that we find so important in keeping our team focused on the job at hand.

Thanks to @Hiraash for his suggestions and I hope you’ll find these tools useful for your project teams. If you’ve got any other suggestions that you think will be useful for other web startups and project teams, we’d love to hear from you.

Wrike

Wrike is a web-based project management tool, and the great thing about it is that it comes with a fantastic Gantt chart view that knocks the pants off any other web based PM tool. @Chandika is a big fan cos he loves the fact that the Gantt chart view gives everyone a good idea of the inter dependencies across the projects we work on here at Creately. Unlike most other recent web-base PM tools that have a strong social collaboration angle, Wrike offers a solid PM tool in the same vein as MS Project, but its pricing is a tad on the high side.

Team Viewer

TeamViewer is an easy to use screen-sharing application that’s Free and works really well. I’ve tried sharing my screen with Skype and other web-services but none have performed as well as TeamViewer. Everyone I’ve recommended it to loves it. And it doesn’t just stop there. Teamviewer lets remotely control another computer - even through firewalls. This is an essential tool we use everyday at Creately. Thanks to @Aslam for bringing this to the team.

Creately

For the uninitiated, Creately is a web-based diagramming software that comes with built in tools for easy, secure collaboration. With an extensive library of shapes, Creately supports many diagram types. Naturally we use Creately in-house - mostly for concept diagrams, flowcharts and mockups. Its great for getting those ideas nailed down quickly in a diagram - and really helps bring clarity to the team.

PS - We released a beta version of a Creately Plugin for the Fogbugz platform this week, which makes it easy to add any type of diagram to your Fogbugz cases and Wiki to clearly explain requirements to your team. You can check it out here.

Zendesk

Zendesk provides a customer support portal solution includes email support with a built-in knowledge base. We chose it for it elegant interface and the ease with which we can track support support issues and deliver the type of customer service our customers talk about. It also worked great for providing 24/7 round the clock support that is being handled across 2 locations. There are a host of other customer support systems out there that actually deliver more functionality at a lower price, but we’re sold on their “Love your Helpdesk” theme.

Pivotal Tracker

Pivotal Tracker is a story-based project planning tool that the Dev Team here at Creately swears by. It is based on the Agile software development methodology and support sprints, velocity, etc but can also be used for other types of projects. If you’re a fan of Agile development - then you’ll love PT, as we affectionately call it.

Best part about PT - Its completely Free (as in beer).

What do you use in your teams? Have you tried any of these tools, and have you found them effective in your business?

@Charan

Image by mr.smashy / CC BY-NC-ND 2.0