Web Apps. Mobile Apps. Awesome!

Our Work

Manhattan Mini Storage Mobile

A screenshot of the Manhattan Mini Storage Mobile homepage

The Problem

Longtime 42 Solutions client Manhattan Mini Storage saw the changing landscape in the way people were accessing sites and doing business and realized that they needed to “go mobile” or risk losing business to those who did.

But how does one go mobile?

The existing Manhattan Mini Storage website consists of hundreds of pages and a dozen sections, all designed for the modern desktop browser. Should the entire site be translated? And, if so, how?

In consultation with 42 Solutions, Manhattan Mini Storage determined that the mobile website would be stripped down just to its sales channel, allowing customers to find available storage near their neighborhoods and reserve them online. Now it was up to 42 Solutions to figure out the rest.

The Challenge

Building a mobile version of the Manhattan Mini Storage sales channel provided an interesting challenge for both 42 Solutions’ design and technology teams. How best to boil down a process that was already so simple into something optimized for the handheld experience?

Working with Mini Storage partner Ready Set Rocket, the 42 design team needed to recreate the experience of a mobile app through a device’s web browser, optimized to the lower resolution and screen size.

The technology team, at the same time, had to isolate what information was necessary for the completion of the workflow and ensure that that, and only that, was being communicated at the proper time to ensure the lightest browsing experience possible.

All of the customer leads and reporting data collected along the way in the standard flow also had to continue being captured in the mobile to ensure the sales team had the most to work with with following up with potential customers.

It was a website for small devices but the challenges were big ones.

The Process

Despite the tranquil surface, the workflow was actually rather complex.

To ensure that no unnecessary work was done and to make sure nothing was done twice, 42 Solutions analyzed the problem and broke it into discreet pieces of functionality. Certain elements would be handled on the server side through the use of RESTful calls while others would take place on the client side.

Individual design elements were identified and areas of reuse noted.

Data calls were planned out carefully to ensure no call was made unless absolutely necessary.

Only once everything was broken up did we begin deciding who would put what together. Tasks were split between design and technology to ensure everyone was assigned tasks for what they did best. And in the end, it worked.

Working with a series of mockups generated by Ready Set Rocket, the 42 Solutions design team turned them into mobile reality through the magic of HTML5. Separating all of the different “pages” into discreet flows, our design team made the entire process happen through the use of a single HTML page. By hiding and showing the relevant sections, the flow would mimic the Look & Feel of any iPhone or mobile application installed on their device.

At the same time, our technology team was writing a series of RESTful APIs to be called from within the application to return data, makes reservations, or generate sales leads.

Where design met technology was in the JavaScript that glued the entire project together.

Only once everything was broken up did we begin deciding who would put what together.

Unlike many shops were designers stick to their Photoshop and everything else is handled by the programmers, the designers at 42 Solutions aren’t afraid to muck about in the code. Beyond just rendering the assets required, our designers created the actual HTML of the page then created “shell” JavaScript functions to show or hide content sections according to where the customer was in the flow.

The result was an entirely “functional” mobile site that our client could step through before a single AJAX call had been implemented. This was a massive benefit to the project that allowed elements to be tweaked and the flow to be modified without interrupting the work of the programmers.

When the RESTful API’s were finished, the 42 Solutions technology team then inserted calls to them within the shell functions that already existed and manipulated the content displayed based upon what was returned. Thus, the integration between technology and design occurred in a matter of days and not weeks.

The Result

One month from the time the mobile project was handed to 42 Solutions, the mobile version of Manhattan Mini Storage went live, allowing millions of New Yorkers to search and reserve storage rooms in their neighborhoods and around the city online with their mobile devices.

And with an interface utilizing many of the native HTML extensions available for mobile browsers, the interface is as fast and familiar to those used to using installed apps.

Meanwhile, for Manhattan Mini Storage, the reservations and leads that are generated by the new mobile site are identical to the desktop experience, allowing them to communicate in the most efficient and customer friendly way.

42 Tags: , , , , , ,
Content for class "bottomYellow" Goes Here
Content for class "bottomBlue" Goes Here

42 Solutions

Working with 42 Solutions, you’ll find that it’s not the technology that’s important, it’s the idea. Regardless of whether your company is based on proprietary software or open source, we will find the right tools to get the job done.

Invite us to your office and we’ll send a pair of consultants armed with laptops and bright ideas, ready to solve your problem and offer solutions. We pride ourselves in getting to know how you do business and integrating into your process.