Marvel Internet Group blog

With any web application there is usually a learning curved involved for the end users before they are familiar enough with the concepts and work flow to explore the application on their own. Especially when a new system is introduced to replace an existing one it can be very difficult for the end user to adjust. That is when support requests start flowing in.

In our experience support emails can become rather difficult when the user does not provide adequate detail about what they are doing, or who they are. The lack of information means a lot of time is spent waiting on user clarification. The time spent identifying the problem often takes longer than providing the solution. This is where investing the time needed to create a custom support form comes in.

In a custom support form that we implemented for ICEF Online (1,500+ people use it almost daily), the form auto-embed hidden values identifying the user’s account, the page they were on before they loaded the support form, as well as browser information and screen size; all of which help us diagnose problems far quicker than if we just relied on plain email, or even an ‘off the shelf’ support ticket system.

For common cases where the reply just requires usage instructions, a custom support form can completely eliminate the need to wait for a user to reply with details of what they were trying to achieve. For more complex scenarios we are able to completely re-create the user experience for testing by reproducing user results with the same browser, operating system, and input values. The limits of how much information your support staff have access to diminishes to almost zero once the basic system is put in place, which is a very low cost given the customer satisfaction returns that can be achieved.

Hi, I’m Alan Attwater, the lead designer for Marvel Internet Group. I’ll be posting general information about the design and development of our online projects, as well tips and tricks on technologies like Typo3 and CSS.

I work on a variety of projects at any one time, designing both shop front websites and web applications. I recently completing the design and development of the new Marvel websites in the Typo3 CMS, only 4,000+ lines of CSS!

I’ve also started on the interface designs for a new in-house project called JustRosters.com, turning VERY VERY rough sketches into attractive, working interface mockups. The biggest challenge so far has been getting the main interface to fit dynamically on any screen size, whilst maintaining it’s main functionality and useability. Sounds easy, but calendars never seem easy to work with. I’ve made good use of the Javascript user interface library jQuery, to provide the main interface functionality, while maintaining fast page load times.

Anyway, better get back into it, after all, those interface sketches are very rough, and Paul is hanging out to start coding!

Now I had a list of features I thought would be useful, I set about sketching the interface. I would use Photoshop or Paint to do this, but I have no skill in either, so I went and found my trusty pen and paper – which, as illustrated, I have no skills with either.

Before I post the scans, I want to reiterate the importance of sketching as early on in the planning stage as possible:

• Sketches force you to consider how your features can work together.
• Even if you are not a designer, the vision is still yours and you are the BEST person to illustrate it. Getting a designer in at this stage will only cost time and money.
• Sketches show you how people will use your app long before any real time is spent on it.
• If you can not fit an interface screen onto a single A4 page, chances are it will not fit on a computer monitor.
• Sketches show you the features you have planned and don’t need as well as the ones you need and haven’t planned.

After a quick run through of the features I decided on earlier, I set about drawing! Here are some of the resulting sketches - click to enlarge:

Sketch 1 – Dashboard with menu system

Sketch 2 – Create / edit / delete staff

Sketch 3 – Options when a roster cell is clicked

Sketch 4 – Manage roster and Preference page

All up there was about 10 sketches. This stage took me almost 5hours, but gave me a true understanding on what was involved, and enough motivation to move forward to the next step, ‘Setting up the project’.

To celebrate the recent completion of the new Marvel Internet Group sites and order system, we are offering a massive 15% DISCOUNT on ANY product from ANY of our sites - when ordered online before the end of February.

If you purchase a recurring product like hosting, the 15% discount is for life!

To claim the discount, simply use the promotion code: WOOHOO when you checkout.

All our products can be accessed via:

marvelpromote.com - Marketing and reporting
marvelsites.com - Design and development
webhostingmarvel.com - Hosting and extras

Even if you don’t want to buy anything we would love to hear your feedback, so drop a comment or contact us.

Most companies can be traced back to a single question asked by its founder/s. A few minutes after my girlfriend called the bar she works at, to find out when her shifts are for the next week, I asked myself: “I wonder if there is a program that helps bars notify their staff about shifts, to save them all having to call or drop in?”.

I figured this problem applied to any business with casual staff, shift workers, and even full time workers that need to be in multiple locations. I did a few Google searches and found a few web based staff scheduling apps; most were bloated with features, had shocking interfaces, or did not notify staff about upcoming shifts. It got me thinking about the core features I would be looking for if I owned, or worked for, a business that have to deal with these issues.

I came up with the following list of features:

• Super easy user interface for building rosters, accessible from work or home.
• Ability to print a nicely formatted roster.
• SMS notifications to staff at the start of each new roster period or shift.
• Simple interface for staff to login and book their days off in advance.

Looking at my list of key features, I continued to search Google for an hour or so. I found few more products but nothing met more than two out of four features I desired. By this time I was getting a bit exited about building such an application. Would there be a market? I contacted a few of my friends and colleagues on both sides of the rostering equation.

As I anticipated, businesses owners complained about the amount of time spent tracking their staffs future days off (written on little bits of paper in most cases), the amount of phone calls from staff wanting to know when and where they were working, and the time it spent building printable rosters in excel. Even a conservative estimate of spending jsut two minutes per staff per week added up to over 4 hours of extra work per month (based on 30 staff), which does not include the time spent wrestling with Excel!

Staff complained about difficulties finding out when and where they were working, the fact that they had to call or write down dates they wanted off, and how frequently these bits of paper went missing. 30 staff members spending five minutes per week on these tasks would’ve wasted another ten hours.

I figured this was enough research for such a small project to get the go-ahead, so I set out creating a more detailed list of features:

• Create rosters of any length – not every business runs on a one week roster cycle.
• Create rosters from old rosters.
• Ability to split staff into departments, and build ‘department specific’ rosters.
• Add multiple shifts to rosters, with notes.
• Let the business owner or staff indicate days off in advance.
• Notify staff about their shifts via SMS at the start of the roster period, or before the shift.
• If business owners make changes to a current roster period, the corresponding staff members are automatically notified.
• Print rosters.
• Export rosters to excel.
• Export rosters to HTML, which can then be posted on to the company website.
• Show business owners, at a glance, the total hours for each day / staff on a roster.

With the new feature list it was becoming clear that this was not such a small project, so I decided to stop writing and start drawing! Total time spent on this stage was about six hours.

Stay tuned for Part 2 - Sketches and feature refinement.

Hi, I am Paul Chiu, lead programmer for Marvel Internet Group (MIG) and soon to be blogger for MIG as well. I look forward to posting interesting information on software development issues from our own experience, as well as commenting on interesting developments in the field of web applications programming.

My current programming focus is on developing and supporting two main client projects with one being a professional networking system and another an administrative system. Client privacy issues prevent me from writing too much about the specifics of those projects, however, I will do my best to cover tips and lessons learnt.

MIG is also working on an in-house project called JustRosters.com that will be the first pure MIG project to launch. I should be able to share more about our experiences and challenges faced in the project. We are currently in the design stages of project so I have not yet started implementing yet, but given the existing design challenges it should turn out to be quite interesting to develop!

I thought a great way to get this blog started would be a series of posts about building a web start-up from concept to launch. The team has recently begun this process for our first in-house venture, JustRosters.com, and I feel our experiences in all aspects of the project are most useful when shared.

I want to keep the guide short and fast, much like the concept to launch cycle. I will try to specify costs and hours where possible and keep the plugs for our web development services down to a minimum

At this stage, I plan to document our experience in 8 parts that consists of:

• Part 1 – Brainstorming and research.
• Part 2 – Sketches and feature refinement.
• Part 3 – Setting up the project.
• Part 4 – Building the HTML mock-ups and design.
• Part 5 – Writing the code and testing.
• Part 6 – Building the front-end website.
• Part 7 – Launch!
• Part 8 – Post launch results.

We are already up to stage 4 of the launch cycle, so I will try and write the first few parts from memory ASAP.

Disclaimer: While I have every confidence in our ability to build and launch an awesome, user friendly web application; I cannot profess to being a veteran at selecting the right business idea/model just yet But hey, you got to be in it to win it!

Marvel Internet Group has been around for almost a year now, so, over the Christmas period I decided that it was time to relaunch the site (well, 4 as it has turned out), which truly reflects my vision for where the company will be going in 2009. Before I plunge into any details I would like to share a few facts from 2008:

• The team logged 11,431.5 hours of work.
• Excluding hosting clients, we helped 42 companies with their design, development and marketing needs.
• We moved out of spare bedrooms into a 130sqm, centrally located, office (no more lunch time beach breaks ).
• We formed strategic partnerships with 2 decent sized companies, providing their clients with design, development and marketing, on their behalf.

So now the plans for ’09 …..

My first goal has been to build separate sites and identities for our 3 major service lines.

OK, so we started this one in November, but here they are:

marvelpromote.com – Marketing and reporting
marvelsites.com – Design and development
webhostingmarvel.com – Hosting and extras

These separate sites help us to stay focused on treating each major group of services like a stand-alone business. ‘Full service’ web development companies rarely offer this, and it can lead to overstretched, under qualified teams, and unhappy clients.

My second goal is to launch at least 2 web ‘start-ups’.

I feel it is important for any web service company to ‘walk the talk’ (displaying confidence in efficient, effective creation and promotion of new ideas). This will serve to demonstrate out competence in all aspects of web development and marketing and will hopefully expose us to new clients as well.

My third goal is for myself and the team to actively contribute to a blog.

We advise our clients to do it, and we have plenty to share, so its about time we started! Keep an eye on our blog for tips and tricks, new product launches, spectacular specials and any amazing, random information we find interesting. You can subscribe to the entire MIG blog, or your specific category of interest by using the links to the left (under categories).

My forth and final goal is to keep the team tight, the business profitable and above all else -keep the clients, employees and myself happy!