New vPanel Design

[VOIPoLarron]

UPDATE: So there is no confusion, this is an old post. Please see the updated version of this thread for information on the new vPanel release which is finally here. http://forums.voipo.com/showthread.php/5230-Coming-in-July...







Hello everyone,

My name's Larron and I am the new UI designer in charge of vPanel.
Please have a look at a simple draft and let me know what you think, like, dislike and want to see.

http://img121.imageshack.us/img121/8606/mainuc.jpg

Thanks
- Larron

[cdwiegand]

So far I like it, definitely looks much more polished!

[usa2k]

The image looks like things are more accessible. I expect the DSLReports.com reviews may get a bump in ratings too. :)

http://www.dslreports.com/gbu

If its been a while, VOIPo users should update their reviews.
Or start one! http://www.dslreports.com/docontrib/ISP/3156

Maybe keep the Reseller design as is, so they don't get a direct association.
Eventually an API for Reseller would mean the the Reseller can provide any look.

[Brian]

Definitely like it. It seems to give things a refreshed and exciting look.

[mikeb]

I'm really happy to see that the redesign is in-progress. It's hard to provide a lot of feedback without actually test-driving the navigation, but so far it looks good. Keep going!

[rcrcr]

Are pull-down menus really the best UI design choice for a site like this one, in late 2010, when an increasing number of users will be accessing the site not from desktops and laptops, but from small screens and touch interfaces?

This is an honest, open question that I hope might foster some discussion about the best possible ways to redesign the VPanel in the most forward-thinking fashion.

[stevech]

In "Features", you might reconsider if the items are indeed all logically related. Would "devices" be a feature?

[lost]

Is this just a facelift or a redesign? A redesign would be a more thorough reorganization of the screens or even changing the whole approach to presenting something. The current vPanel are not only plain-looking (which would be fine), but unintuitive and poorly organized. Some of those sub-items don't belong together, for example, the very tab you displayed:

Features/Preferences/Password
Advanced - Softphone/BYOD - Password - PIN - Display

That very screen doesn't even make sense to regular users.

[VOIPoTim]

Hey Guys,

Keep posting any ideas. We hear a lot of people saying that vPanel's current design is bad, but very few people tell us why they think that.

The more specific feedback we have, the better.

[VOIPoTim]

Is this just a facelift or a redesign? A redesign would be a more thorough reorganization of the screens or even changing the whole approach to presenting something. The current vPanel are not only plain-looking (which would be fine), but unintuitive and poorly organized. Some of those sub-items don't belong together, for example, the very tab you displayed:

Features/Preferences/Password
Advanced - Softphone/BYOD - Password - PIN - Display

That very screen doesn't even make sense to regular users.

It would be great if you let us know what you think would be better nav wise.

[holmes4]

I always find my self wandering around the panel interface trying to find the function I want. I remember I've seen it somewhere, but it's rarely where I expect it to be. I generally dislike cascading menus, especially when the upper category isn't obvious.

What I'd like to see as an opening page or at least accessible with one click is a page that lists all of the functions with direct links.

[LoadStar]

I posted this in another thread, but I think that this could be worked into a redesign of the VPanel:

It would be nice to have a "dashboard" page, possibly one I could set as my browser start page. Things I envision on this page:
- number of support calls "in work" (if this number suddenly jumps, we know there might be an issue)
- top XX issues ("can't complete calls to 712 area code" "phones aren't ringing" etc.)
- date/time of any planned service interruptions and expected restoration date
- news and service updates ("New Vpanel interface debuts 6/23" "New Beta Feature: Simul-Ring" "URGENT: Please reboot your telephone adapters now!" etc.)
- Last XX call log
- Voicemail
- Frequently used features on/off

Ideally, this would be an AJAX page that could update automatically, and it would have a "stay logged in on this computer" that would store a cookie, so it could be set as a start page for a browser. This wouldn't completely eliminate the VPanel, but it would be a "one stop shop" for 80% of the things that customers would need or want to know about or do with their VOIPo service.

If you REALLY wanted to get fancy, this could be a portal type of environment, with different "widgets" or "portlets" that could be plugged in... i.e. a "call log" portlet, a "support status" portlet, a "voicemail" portlet, that users could snap in the portlets that they think are most important to them.

[lost]

It would be great if you let us know what you think would be better nav wise.

Tim, some of them are scattered around different screens and can be confusing and hard to remember. Some features must be configured in several screens, like Telemarketing Block is enabled on the basic screen but the list is managed on a different screens.

You could start by grouping some into a logical "Incoming" and "Outgoing" configuration groups. Under the Incoming section, you can have the call forwarding, call routes, teleblock, DND, virtual numbers, etc, and under the Outgoing section, you can have caller id, call routes, directory assistance, international calls, etc. On the same level as Incoming and Outgoing, you can have Devices (and put SotfPhone/BYOD under there).

Top Level:

Incoming Settings
Outgoing Settings
Call Logs
Voicemail
[E911*]
Devices
Account
Support


Under Account, put the items that are currently in different Preferences blue bar/tabs, but streamline them into one screen instead of multiple tabs.

Billing gets moved under Account as well.

*I would prefer to move E911 to Outgoing, but if you want to keep that easy to find then you could leave it on the top level.

[stevech]

This needs a couple of smart end user oriented people to design, rather than a VoIPo engineer/tech who is too close to the product to get the users' perspective.

[VOIPoTim]

This needs a couple of smart end user oriented people to design, rather than a VoIPo engineer/tech who is too close to the product to get the users' perspective.

That's why we're asking here and giving all users the opportunity to let us know what they think should be changed in it.

[4plus3vette]

Under Features, once you click on any feature, such as Call Routes, the "Basic Features" go away and you have to click on the top level Features again to get Basic Features back. Basic Features should be a choice in the list.

Also, under Features, when you select either Contacts or Preferences, the 2nd level menu goes away and is replaced with the a 2nd level menu for Contacts or Preferences. The only way to get the original 2nd level menu back is to select Features again. It would be preferable if the 2nd level menu did not go away, but a third level menu came up for those features.

Personally, I like the overall functionality of the current page (tabbed browsing over drop-down menu browsing). The screen-shot of the new design is more attractive, however, I do like the ability to see all of the 2nd level options of, say, Features when I am in one of those areas without having to move my mouse up to (and possibly clicking on) Features.

Some of the features in Beta may be able to be moved out into other categories as others have suggested.

I know that you are working on documentation, but that is probably one of the things that would help out the vPanel the most. As a new user, when I went in, it was pretty frustrating trying to figure out what some of the features were and how they worked. Having to call or chat with your support team is expensive for you if 95% of those contacts could have been handled by the user by looking up the information themselves.

Overall Tim, I appreciate the ability to change these features at will and I think things look pretty good overall with the site. You could dress it up with "better" graphics," more colors, ..., but over all, I think that your company, via this site, gives more access to options (and just plain more options) than any other phone service that I have used.

Thank you for giving us the ability to provide feedback and for being so involved.

Jim

[4plus3vette]

Here are a couple of other items that would be nice to see:

1. Caller-ID details in call history. This may already be here, but I can't seem to find it. Either have a "mouse-over" or list the data to pass on the name associated with the caller-ID info.

2. Make a customizable start-up page where the user can select a few areas that he can have displayed at login. These areas may be smaller, sub-sets of the real page. For example, perhaps I would like to see today's incoming/outgoing call history, basic features, simulring, voicemail, and distinctive ring on my homepage. You could institute this by a selection box on each navigable page that says "include on your home page."

Take care,

Jim

[mikeb]

Under Features, once you click on any feature, such as Call Routes, the "Basic Features" go away and you have to click on the top level Features again to get Basic Features back. Basic Features should be a choice in the list.

Also, under Features, when you select either Contacts or Preferences, the 2nd level menu goes away and is replaced with the a 2nd level menu for Contacts or Preferences. The only way to get the original 2nd level menu back is to select Features again. It would be preferable if the 2nd level menu did not go away, but a third level menu came up for those features.

Jim

The two issues that Jim mention about the menu items disappearing bother me the most.

Another area of frustration is the lack of instructions about how to use a feature. Please provide information about each feature on the web page where the feature is configured.

Thanks!

[4plus3vette]

Another (minor) one. I was just checking out the instructions for Simulring in the Beta Manual.

It states, "Be sure that you set the ring seconds to a value larger than 0, otherwise, none of your lines will ring."

Why don't you make the default setting for 10 seconds to avoid the problem? People may not immediately know about that issue without reading the manual first.

[4plus3vette]

To help out with Mike's suggestion, since you now have:

http://www.voipo.com/documentation/vPanel.pdf

available, you could probably institute a help button (like F1 or something) and have it bring up a new window that automatically goes to that section of your manual.

[tritch]

I would like to see "Devices" moved to its own tab. It would be even better to have the status of the devices show up automatically somewhere on the top or bottom of the webpage as soon as you log in with a refresh button next to it.

[VOIPoLarron]

I've spent some time reading some input from everyone and developed a basic list of the new navigation for vPanel.

There are a few things I need to clarify so please continue reading before you go over the sitemap that I post below.

After logging into vPanel the dashboard will have the most important things that need to be seen, such as:

Service updates, interruptions & any other notifications
Voicemail activity
Latest call history
Latest invoicing information
Along with any other need to know information


The dashboard will also have a complete list / site map with icons, titles, & descriptions to any main category and main sub category with in vpanel for quick and easy access.

Our navigation menu (the drop downs shown in the previous design) will support this same structure of main category -> sub nav

Each main category will have it's own overview page. As an example, if you were to click on the Features category. You will again be presented with a list of all features including their icon, title & brief description

Last but not least we would like to introduce a vPanel feature called Favorites, this will allow you to add any page within vPanel as a shortcut in your drop down menu under you guessed it... the "Favorites" tab.

Please review the sitemap below and let us know what you guys think.


My Account

General

Allows you to view or edit your billing and payment information.

Invoice

Shows your current invoice, with links to transaction history and pay invoice.

E911

Allows you to manage your e911 addresses and add new ones.

ATA Preferences

Set your ATA preferences

Softphone / BYOD Devices

View softphone SIP credentials

Password

Change your password

PIN

Change or set your pin

Display

Update your display settings

Feature Control

Disable or enable a feature from showing in the nav

Favorites Control

Add or remove a link to your favorites category

Referrals

View referral history


Features

Voicemail
2nd Line
SMS Controls
Simul Ring
Call Recording
Mobile
Distinctive Ring
Caller-ID
Scheduling
Basic Features
Virtual Numbers
Tele Block
Fax
Call Routes
Call History
Contacts
Devices

Tickets

Shows a list of tickets as well as a way to create a new ticket.

Favorites

Displays your favorite pages configured from My Account -> Favorites Control



Thanks

[holmes4]

That looks pretty good at first glance.

[stevech]

please try to move away from drop-down menus to a more contemporary UI. No one likes to hunt menus for the sought-after function.

But keep it browser-agnostic and flash-free!

[usa2k]

I personally like drop-down menus.

My suggestion would be to add a column to the right perhaps that lists direct links to the xx most used menus the user accesses.

[4plus3vette]

Larron,

I am not sure if I understood you correctly. Were you saying that the top level menu would have a drop-down, but once you selected something from the list, a second level menu list would appear, similar to what is currently available?

For example, once you are in the features menu, you see a list across the screen that shows Voicemail, 2nd Line, SMS Controls, Simul Ring, Call Recording, ... So, after you click on Features one time, you don't have to go into the drop-down menu again to select another feature??? If so, I think that would be acceptable to most users. Users like stevech and me wouldn't have to keep hunting through drop-downs if we just wanted another feature AND users like usa2k would be able to do it either way.

I also like the idea of a BETA tab. Even if there is nothing in it to start (because all current Beta's go to Alpha), you may want to keep it there (empty) as a place holder for new, less supported, features.

Thanks,

Jim

[tylerscell1]

Will there be a mobile version?

[stevech]

I also like the idea of a BETA tab. Even if there is nothing in it to start (because all current Beta's go to Alpha), you may want to keep it there (empty) as a place holder for new, less supported, features.

Thanks,

Jim

Isn't Beta (testing) done after Alpha testing?
I read about software "black box" testing where the testers shall not know ANYTHING about how any of the the user or operating/database software behind the UI was implemented. Avoids the subconscious aspect of testing if done by technical folks anywhere close to the development process.

[4plus3vette]

Oops, I guess I meant beta goes to production.

Good catch.

[VOIPoLarron]

Will there be a mobile version?

We are certainly considering a mobile version for future releases, but focusing on having the best web interface first.

[VOIPoLarron]

please try to move away from drop-down menus to a more contemporary UI. No one likes to hunt menus for the sought-after function.

But keep it browser-agnostic and flash-free!


There will certainly be no flash. Not sure what you mean by contemporary nav, could you explain a bit more? As far as the drop downs, we are thinking that we have the nav with only one level of drop downs for ease of use, but you will also have an easy side navigation when on a category. Let me know if you think that would suffice.

Thanks

[VOIPoLarron]

I personally like drop-down menus.

My suggestion would be to add a column to the right perhaps that lists direct links to the xx most used menus the user accesses.


This would be covered in the feature that I was talking about with allowing you to control your "Favorites" tab.

[VOIPoLarron]

Larron,

I am not sure if I understood you correctly. Were you saying that the top level menu would have a drop-down, but once you selected something from the list, a second level menu list would appear, similar to what is currently available?

For example, once you are in the features menu, you see a list across the screen that shows Voicemail, 2nd Line, SMS Controls, Simul Ring, Call Recording, ... So, after you click on Features one time, you don't have to go into the drop-down menu again to select another feature??? If so, I think that would be acceptable to most users. Users like stevech and me wouldn't have to keep hunting through drop-downs if we just wanted another feature AND users like usa2k would be able to do it either way.

I also like the idea of a BETA tab. Even if there is nothing in it to start (because all current Beta's go to Alpha), you may want to keep it there (empty) as a place holder for new, less supported, features.

Thanks,

Jim

Yup this is correct :)

[internet54]

Wow, I went to this thread expecting a fresh looking design. Being a web designer/developer, I can say that it looks easy to navigate. That, above all, is the most important about the design...

That said, why not try a completely different approach instead of the forum header look?

I'm sorry my first post seems mean, but designing and coding is what I do all day.

[MisterEd]

I would like to see a more updated "call history" with the caller ID available in one of the columns rather than having to hit a dropdown each time to see the CID as it seems the majority of providers do it.

[fisamo]

Wow, I went to this thread expecting a fresh looking design. Being a web designer/developer, I can say that it looks easy to navigate. That, above all, is the most important about the design...

That said, why not try a completely different approach instead of the forum header look?

I'm sorry my first post seems mean, but designing and coding is what I do all day.

Please don't take my response to your post as being snarky--it's not my intent. But do you have any suggestions for "a completely different approach"?

Here's my suggestion:
I was pretty happy with the CallVantage user interface when I had that service. Upon login, I got a service dashboard that showed status of key features (such as forwarding, do-not-disturb, etc), details regarding the 5 most recent voicemails (caller info, date, time, voicemail had not been listened to if info was in bold)... I could change the status (generally toggle only) of individual features directly from the dashboard, or I could click the name of the feature for more options. Contacts were in a phonebook format (limit of 5 numbers per person; name in phonebook functioned as custom CNAM). Names were all listed alphabetically, with numbers alongside, rather than the records-within-a-record setup that Voipo has implemented.

Most options were all arranged in a single column down the left side of the screen--this column was always visible when logged in. Clicking on one of those options generally brought up the screen I was looking for. In some cases (features one generally wouldn't change often, such as failover destination), I had to click multiple links to get to the screen I wanted, but for the most part, everything I needed was only one click away. In the rare cases where more than one click was needed, it seemed pretty intuitive to figure out how to get to the desired feature controls.

[internet54]

No snarkiness taken.

This is my first voip experience and was just referring to the design aspects of the panel. It looks more early 2000 than 2010. If I took a long enough look at this I could probably put together a really nice and intuitive design. Since I don't have much voip experience, I wouldn't know the best content structure and link tree.

I'm willing to provide my services if requested.

[ctaranto]

Will there be a mobile version?

I think this would help separate the usability from a PC vs usability from a mobile device.

Come up with the "best" interface for a PC, and then create iPhone and Android apps that optimize the functionality for those devices. Best of both worlds.

Granted it takes resources and time to do both, but that should be in the plan.

-Craig

[usa2k]

Hopefully the redesign is actually an API prototype.
Something that will let you customize as you wish in the future.

Mobile variations should be a matter of CSS.
And make sure printing is also formatting by CSS.

[eacollin]

This needs a couple of smart end user oriented people to design, rather than a VoIPo engineer/tech who is too close to the product to get the users' perspective.


How lame is that response.. Why not give some suggestions and be constructive..

[stevech]

How lame is that response.. Why not give some suggestions and be constructive..Was done, back-channel.

[Warus1]

I concur with Fismo, I really liked the dashboard view over @ Callvantage.
Too bad we don't have a screen print to use as a sample.



Please don't take my response to your post as being snarky--it's not my intent. But do you have any suggestions for "a completely different approach"?

Here's my suggestion:
I was pretty happy with the CallVantage user interface when I had that service. Upon login, I got a service dashboard that showed status of key features (such as forwarding, do-not-disturb, etc), details regarding the 5 most recent voicemails (caller info, date, time, voicemail had not been listened to if info was in bold)... I could change the status (generally toggle only) of individual features directly from the dashboard, or I could click the name of the feature for more options. Contacts were in a phonebook format (limit of 5 numbers per person; name in phonebook functioned as custom CNAM). Names were all listed alphabetically, with numbers alongside, rather than the records-within-a-record setup that Voipo has implemented.

Most options were all arranged in a single column down the left side of the screen--this column was always visible when logged in. Clicking on one of those options generally brought up the screen I was looking for. In some cases (features one generally wouldn't change often, such as failover destination), I had to click multiple links to get to the screen I wanted, but for the most part, everything I needed was only one click away. In the rare cases where more than one click was needed, it seemed pretty intuitive to figure out how to get to the desired feature controls.

[VOIPOinTN]

Another suggestion, when logging off, go back to the VOIPo home page or make the logo on the login screen a link back to the home page. I typically logon, then go to the forum, right now it is a few extra clicks. Thanks

[adrienqa66]

It would be great to have a "Forum" link from the VOIPo control panel.

I would also like to see more detailed caller ID.

I also get confused by the current set of features: more specifically: the contacts and groups and also the "blacklisting," "whitelisting," etc. etc. terminology that is used. It isn't always clear what they mean / what they will actually do.

I find myself testing features all the time because they're frequently confusing.

I think placing them in clearer categories - categories that are not so scattered all over the place as other people have mentioned will make the navigation easier.

I definitely agree with having a "Help" option. It would be great if you could somehow integrate the help articles in the VPanel so I don't have to leave the VPanel to check out the Help link and then have to type the URL again and go back to the page I was previously on.

I was reading the posts about the user interface and CallVantage. I did a Google Images search for CallVantage and there are screenshots of the control panel. Perhaps you could use those to visually explain the control panel features you want that would be clarified with such screenshots?

Here's one: http://images.pcworld.com/news/graphics/120888-n_052305_callvantage1b.gif

There's a couple of images on this page: http://pcworld.about.com/news/May232005id120900.htm

There may be more available through Google Images, so I'd suggest doing a search and finding the photos that show the useful user interface features.

[eroomjt]

As long as it works in iPhone Safari, Android, Blackberry internet browsers it looks much better. There are a few dead end menus in the current version where you get lost as to how far down in the hierarchy you have gone.

[eroomjt]

Specifically, I currently can find NO WAY to set up a GROUP. Then i want to forward that group to a funny NO TELEMARKETERS number 973-474-9051 that play a message telling the telemarketer to get lost. I finally found the ADD GROUP button all by itself in the color band at the top. But it doesn't do anything. I cant seem to add any numbers to the group. I cant seem to add the group to an OUTGOING CALL ROUTE. What gives.

[eroomjt]

VoipoTIM,

If you want some input, try posting the hierarchy in outline format. Include crosslinks (ones that might appear in multiple locations where they make sense intuitively). Then others could copy, edit and repost the hierarchy to show how it could be more intuitive. Right now, no-one wants to take the effort to lay it out for you, but might it they could just copy paste their ideas.

[VOIPoTim]

This is actually coming along nicely. We'll have an updated preview for you guys this week.

Initially we will be running both the old and new versions side-by-side for testing and should be ready to start that in 2-3 weeks.

We've been playing with different concepts for last few weeks and I think we have a very good solution for the menu system worked out now which should make things a lot easier.

Basically everything's been organized into a few main categories (Account - Features - Tickets) in the top menu. Then all the subpages within that category are in a side menu.

http://img408.imageshack.us/img408/8508/newpreview.png

We're going to be reorganizing the subcategories some, but this is the overall concept for how we're planning to structure the menus.

There will also be a help bubble beside each item in the subnav.

What do you guys think?

[usa2k]

I like!!!

How come "Powered by VPanel"? I thought it was the classy "vPanel"?

I kinda like the name "vPortal" BTW.:)

[buckethead]

There will also be a help bubble beside each item in the subnav.


Depending on what information you include in the help bubble this is the biggest addition and best change to the new vPanel.

[fisamo]

I agree--looks pretty good, but it depends on how the categories are ultimately laid out.

One usability issue I have with the current vPanel, that I haven't seen mentioned lately, is that it relies very heavily on dropdown menus. When there are situations where I have five or less items to choose between, I'd far prefer radio buttons, because all of my choices are visible, and it's a single click to make my selection. Using Tim's screenshot above, I'd recommend that the controls for "Start option", "End option", and "Schedule Every" be changed to a more user-friendly method. Seriously--why should I have to click twice to change a "disabled" to "enabled"?

As another example, every option on the "Features" page (as laid out in the current vPanel) should be managed by radio buttons. The options that require space for the user to specify a number (failover and forwarding) would have that field displayed next to the "Forward To" radio button...

I know I've brought this up before, and (in case it isn't obvious), this is a big pet peeve of mine. I'm not asking you to change it just to make me happy, but because the other selection method would make vPanel MUCH more user-friendly.

[Warus1]

Nice work. I like the layout. Can't wait to see the next revision with the categories reorganized.

I too prefer radio buttons, but not hung up on it.

Thanks to all the folks at VOIPo for all your efforts

[wthart]

Nicely done!

[mdntblu]

When will this be implemented?

[jfrizzell]

A bit surprised to see this still hasn't been implemented. It's been 7 months since we saw a sneak peek at the work being done.

[VOIPoTim]

A bit surprised to see this still hasn't been implemented. It's been 7 months since we saw a sneak peek at the work being done.

It's coming in the very near future.

[racerdude]

It's coming in the very near future.

Tim - any update on when we will see the new UI?

[VOIPoTim]

Tim - any update on when we will see the new UI?

Soon. It's been delayed some but is still in the works.

An outsite design firm is also working on a new voipo.com main site too.

[B2ntx]

Just now getting a chance to weigh in on the revisions. Almost all the input I'd offer has already been offered by others (thanks!).

I would like to suggest indicators in the Call History for two things:

1. Disposition codes (e.g. Answered, Forwarded, VM, Busy, etc.) - including special codes for "routed" calls (e.g. Blacklisted, Whitelisted, Busy Tone, Disc Tones, Forwarded, etc.).

2. A link to the corresponding call routes table entry for each call in Call History that was routed (in or out).

Rationale: A great deal of the value that VoIPo delivers is the ability to route incoming calls so nuisance calls can be managed and priority calls are well handled. Many of us seem to spend time in vPanel periodically going thru Call History finding calls which should be routed differently in the future (mostly telemarketers and wrong number callers in my case). I currently do this in two browser tabs. It would be much easier if the above ideas are incorporated into future vPanel versions. The ideas need more work, but hopefully the basic ideas are clear enough.