Web App: Juvely

The other day James revealed his first mockup of the app website, and hopefully like myself when seeing it you loved it! His original mockups for Juvely near enough completely different to what they are like at the moment, he said he is going to put a post up about how his designing has progressed so keep an eye out!

One of the things on the mockup we said is that Juvely is “smart, simple and elegant” (originally sexual instead of elegant - lol), so I thought I would reveal a few things to explain how they are so. I expect a lot will change before we release the beta.

I will start with a couple of pics from the staff center, first is the Dashboard which is what you see when you log in.

At the top we have a ‘Whats going on?’, which as you can guess tells you what is going on. It has easy to access links to unanswered tickets, unassigned tickets, and replies that need attention as well as telling you how many other staff are online. I expect the colours are going to change to highlight some changes, and as you can see the number of support staff online has not yet been implemented.

Next is the Recent Tickets, which shows you recently updated tickets. The priority is shown simply as well as when the ticket was last updated in an easy to read human form. The star next to the priority means that the ticket has an unread reply, Iwe need to rethink these as at the moment they are not very easy to understand. Under the ticket title is a short sample of the original ticket message left by the user.

Lastly down the bottom we have the Recent Activity which shows what other staff members in the helpdesk are up to. The icon varies depending on what action the staff member has performed. Again we have easy to read dates. The number of tickets and number of recent actions shown are both configurable, in the screenshot I have the limit set to two so everything fits in nicely.

Next up is the view ticket page. The top bit shows you various details such as the status, whether the ticket is open or closed, who it is from (User is the name of the user, we might change this to display their email address as well), when it was submitted, the severity, department and lastly the priority. We have used AJAX where we believe it to be sensible to provide the best experience for the user of Juvely but also (unlike quite a few recently created apps) allowed people who do not have Javascript enabled to use the site just as well. In the big yellow box is the users initial message.

Next we have the section that allows you to reply, looking back it looks to be rather small so I expect I will add a link to expand the textarea. On the right hand side as the moment there isn’t very useful information. Our “formatting rules” (rename needed) are textile markup, so I expect we will have a few examples here. At a later date we may add a WYSIWYG editor, but I shouldn’t think so to begin with. Under this we have options, such as having an email reply, an SMS reply, and to closed the ticket. Lastly you can attach files if you wish.

Under the reply sections we have the current replies to the ticket. The reason why the ‘View Current Responses’ bit has a red background is because you can toggle whether that section is displayed or not. We originally planned to have a few more sections but as we don’t this seems rather pointless so I’ll probably get rid of this. The responses are laid out easily to read in descending order of when they were posted. At the bottom of the reply you can see any attachments that were included with it, and how big they are. Clicking on the name of the file will download it. The icon will vary depending upon the fietype.

Lastly under that is an RSS link for this ticket, all tickets and ticket lists have RSS feeds at the moment which let you view any replies and any changes made to the ticket.

Well I shall leave it at that for now, I expect I will post later on this week with a few more pages to tease you with!

If you are developing an app I would highly recommend doing this yourself, I am actually quite suprised at how many things I have thought could be done better another way by looking at it in this way, where as just normal development you don’t take any notice of the little things.

As before, if you are interested in being part of our beta signup!