New Profile Interface Anyone?

New Profile Interface Anyone?

by Darren Smith -
Number of replies: 32
The recent blog and portfolio discussions got me thinking about the current profile page - in particular the edit view. You see, it's not actually a profile settings page. There are loads of other bits and pieces in there which should really be separated out to make them easier to find and the different elements more obviously linked together (surely description should go under firstname / surname).

I would like to see additional tabs (which could be expanded to include portfolios, blogs and whatever) to break up the settings which can be of a technical nature. Specifically the inclusion of a message settings tab, preferences and possibly a course management tab.

The following mock up is what I envisage would be within each tab. There would be more clicks involved to complete the same operations but I see this as a compromise I would be willing to accept in order to improve the usability. Also, new users would not be presented with a huge list to complete when they first register with the site and they may have no idea what the more techy options would mean. Anyway, they don't need to fill them all out straight away.

Don't get hung up on layout and icons - I was just playing - it's intended more as a proof of concept and a means to open a discussion on the matter. So, ummm, discuss smile


Attachment profile_n_settings.gif
Average of ratings: -
In reply to Darren Smith

Re: New Profile Interface Anyone?

by N Hansen -
Too intimidating and overwhelming. They are more likely to edit things if they are presented all on one page.
In reply to N Hansen

Re: New Profile Interface Anyone?

by Samuli Karevaara -
Maybe, but by separating them a bit maybe things that are changed less frequently wouldn't get in the way of those things that the students might want to change on a more regular basis. Have to first identify what those are though smile

And the current interface is not all-in-once either, there are separate functions for
- change password
- unenrol from course
- message pop-up window (that separates into three tabs)
- profile editing
- forum post checking (two more tabs from this)
- activity reports (four more tabs from this)

So as Darren mentioned, the profile settings "page" is getting more to a "personal command center", hence his idea for some kind of redesign.

I kind of like the idea, needs some work still. I wish iframes would not be such a "bad thing" wink, there is a lot that could be done with them...
In reply to Samuli Karevaara

Re: New Profile Interface Anyone?

by W Page -
Hi Darren, N & Samuli!

This suggested change is more like a MyMoodle page without the grades. smile  I guess grades and graphs/charts could be added later.*  Do you have an idea of how you would arrange the page ==> presentation to a student?  When things are in the upper portion of the page so one does not have to scroll to see them, it always seems better.

WP1

There is some discussion in the Gradebook Forum to centralize grades so grades can eventually be placed on MyMoodle pages.

In reply to W Page

Re: New Profile Interface Anyone?

by Darren Smith -
Thanks for the replies so far.

I do see this being linked into mymoodle as a kind of modular control centre so other features can just be easily bolted on a la 1.5 assignment.

With regards to presenting the information to the user, I thought just expanding upon the current tab interface  would be enough - perhaps forcing 2 rows if they expand to far?


Attachment tab.gif
In reply to Darren Smith

Re: New Profile Interface Anyone?

by Julian Ridden -
I think this is a brilliant idea.

I have an issue with my students being overwelmed with too many options. Especially as they don't have to edit 90% of them

This kind of layout also makes the values look a little more friendly by allowing users to directly access the functions it ios they want t acess rather than scroilling through a large list.

i also don't mind the icons at all. Where did you find them?
In reply to Julian Ridden

Re: New Profile Interface Anyone?

by Darren Smith -
Thanks for the support, Julian.

The icons are called nuvola and can be downloaded freely from: http://www.icon-king.com/goodies.php.en

If you look in the theme forum you will notice one or two 1.5 themes which include these icons as a modified moodle icon set.
In reply to Darren Smith

Re: New Profile Interface Anyone?

by Jason Hando -
I too like this idea and would like to see more refinement especially of a graphical nature to settings. One thing that is nice about Moodle is the relatively light data transfer - ie. minimal graphics. This can be both +ive and -ive. But on such an important page as Edit Profile I am sure a few graphics will be worth their weight!

I don't think the interface is too intimidating or overwhelming as N Hansen suggests. Take a look at massively popular software and how they present options to the user, eg. MSN Messenger:


Attachment msn.jpg
In reply to Jason Hando

Re: New Profile Interface Anyone?

by Chardelle Busch -
Picture of Core developers
As WP suggests, this discussion needs to take place within the frame of My Moodle and the current plans for it (whatever they are???).

Anyway, screenshots are good to get ideas, here's another screenshot from a CMS I use on a site. Note, this is the view when logged in as admin--something maybe to keep in mind. Thus, there are tabs here that obviously would not show up for end users. (The My Modules is actually a tab that has the messaging preferences.) The link to this page (Control Panel) appears in a "main menu" type of block after someone logs in. Obviously there are not as many user options for this program, but I like the GUI--very simple and straight forward.

One thing I would really like to see as part of My Moodle is a My Courses tab that shows all courses, the enrollment date, the "finish" date (unenroll or last day?), and maybe some time of tracking, i.e. in progress, completed, final grade, etc.
Attachment mymoodleexample.gif
In reply to Chardelle Busch

Re: New Profile Interface Anyone?

by John Papaioannou -
This sounds like a good idea, sure!

A little technical note here: if a separation of options into categories is defined, then we can build the foundations for displaying these categories just once. Suppose there are functions like

profile_options_password();
profile_options_personal();

etc.

Then it's easy to move them around from e.g. the Profile to My Moodle if desired. But the flexibility doesn't stop there, thanks to the very powerful themes system (bravo Urs approve). Let's say that profile_options_password prints something like:

<div class="setting" id="s_password"><label for="i_password">Password: </label> <input type="password" id="i_password" /></div>

With all these class and id hooks (there should be more, I wanted to keep it short), we can standardize the HTML and allow people to play around all they want to create layouts radically different to what we have now. We can even display some settings in two or more places (e.g. Profile and My Moodle) and have them appear differently in each place just by tweaking the theme CSS.

Anyway, if I had time to work on this, that's what I 'd try first. wink

EDIT: Just saw Martin's post (scroll down a little). Let's put in all those CSS hooks, and we can leave the standard theme looking just like it is now (OK, maybe a little prettier). People who want to go berserk with icons will be able to do it without modifying any code.
In reply to John Papaioannou

Re: New Profile Interface Anyone?

by Chardelle Busch -
Picture of Core developers
For what its worth, if you look at my screenshot, you will see two links at the bottom, Image off and Desc off, these turn off the icons and the descriptions.
In reply to Darren Smith

Re: New Profile Interface Anyone?

by Ralph Blakeslee -

Darren,

I support the concept.  I think organizing items into logical groups makes sense and is easier for non-technical types to handle. 

Ralph

In reply to Darren Smith

Re: New Profile Interface Anyone?

by Martin Dougiamas -
Picture of Core developers Picture of Documentation writers Picture of Moodle HQ Picture of Particularly helpful Moodlers Picture of Plugin developers Picture of Testers
It's a timely exploration - good stuff.

Groupings could be good, but I'm not big on too many icons. Cpanel has pages of them and it drives me nuts. The other thing to avoid is the need to click in and out of section after section to find something, so not too many groups.

Also remember that we will at some point have admin-defined user fields in there (eg favourite color, gender) so they have to be taken of.

I think a second row of tabs under "edit profile" would fit best, just as long some good sections can be agreed on.
In reply to Martin Dougiamas

Re: New Profile Interface Anyone?

by Darren Smith -
I agree about the click in and out scenario but feel that this may be less of an issue here. As already pointed out, the things we are discussing here are to allow somebody to easily access a setting or feature. These are not, on the whole, options which would be used frequently nor a lot of tweaking in one go.

As for a more functional interface for the groupings, how about something similar to the Admin page?

As a starter are there any additions / subtractions to the headings in my original post? Namely Profile, Message Settings, Preferences, Course Management.

How about Moodle Messages? Not all courses would have the messages block and a lot of users block pop-ups. Also, this would link to the forum posts being here - especially if it is all going to be integrated in the future.
In reply to Martin Dougiamas

Re: New Profile Interface Anyone?

by Julian Ridden -
Lots of talk and obviously lots of suport. Anyone brave enough to want to take this on?
In reply to Julian Ridden

Re: New Profile Interface Anyone?

by Mark Little -
Looks very good...

Good Idea...

We want to take some of the fields away because some of our students/staff would get confused with all the settings... (Too many)

Thanks
Mark
In reply to Darren Smith

Re: New Profile Interface Anyone?

by Mark Little -
Hi Darren,

Have u had a look into this yet because this would be very helpful to us..

Thanks Mark
In reply to Mark Little

Re: New Profile Interface Anyone?

by Darren Smith -
Hello.

I'm affraid I don't have the skills to do this sad It was merely a 'proof of concept' post to see if there was interest in my idea and then, if the developers agreed, it would heopfully get picked up for 1.6 or beyond.
In reply to Darren Smith

Re: New Profile Interface Anyone?

by Darren Smith -
I was reminded of this thread after seeing My Links in the MoodleFN code. There was a bit of support for this idea first time around but I think the eye candy put a few people off big grin. I don't think eye candy would be much of an issue with my latest attempt blush

I have been playing around with blocks in MyMoodle and created a Student Tools block which was the easy bit. It was my intention to just chop up the forms in user/edit.htm and other bits from user/edit.php and create new pages so I just got the relevant bits for each link but looking at user/edit.php it is looks far more complex than that and it didn't take me long to realise I was out of my depth.

Is there still a demand for a chunked profile rather than the one page? Anybody who knows how to do it want to have a go? shy

Thanks for reading my post.

Darren
Attachment Picture_4.png
In reply to Darren Smith

Re: New Profile Interface Anyone?

by Darren Smith -
Raised as Bug #5220
In reply to Darren Smith

Re: New Profile Interface Anyone?

by Darren Smith -
Robert Brienstein has been looking at a solution for this and has grouped the user profile page the same way he has with the course settings page. This is a working page from his site:


Attachment user_profile_solution.jpg
In reply to Darren Smith

Re: New Profile Interface Anyone?

by Julian Ridden -
that is starting to look good Darren.

My issue is however still with the amount of information on the screen at one time for the user to fill out.

I would like to see a "tabbed" approach. This allows for information to be split onto seperate screens to avoid information overload as well as adding future scalability tro Moodle as in future releases tabs could be added or individual screens maintained as needed.

It also adds the posibiliy of an admin function to hide tabs that the site maintainer may decide is not needed for their install. (i.e. hide avatar tab to prevent avatar options appearing to users, thus effectively disabling the feature)

I have attached a mockup.

Thoughts?
Attachment example.png
Average of ratings: Useful (1)
In reply to Julian Ridden

Re: New Profile Interface Anyone?

by Mark Little -
Hi,

Like both options....

we should be able to choose which option we want in the setup screen...

I will be adding this to our installation when we move to 1.6

Keep up the good work.
In reply to Julian Ridden

Re: New Profile Interface Anyone?

by Darren Smith -
This looks excellent - would really sort out screen bloat smile
In reply to Julian Ridden

Re: New Profile Interface Anyone?

by N Hansen -
"Information," "Preferences" and "Additional Information" are meaningless tabs though unless the student already has been told what they mean. I think if you use such meaningless names for the tabs then you run a real risk of them being ignored. I actually liked the latest one-page mock-up that Darren posted.
In reply to N Hansen

Re: New Profile Interface Anyone?

by Robert Brenstein -
The latest one-page pic that Darren posted is not a mock-up. It is from a live site smile

I am always torn between a single page and multiple page (tabbed in this case) layouts. One aspect is usability. Another is performance. As admin, I tend to prefer a single page layouts, so I hit server only once (but admitedly it is a somewhat bigger hit) and have all info within a scrolling distance (but admitedly I have a good mental model of the data). However, many users indeed prefer tabs so they see only a subset of items at a time. So may be an option to decide this for each site is worth considering even if requires extra coding.
In reply to Robert Brenstein

Re: New Profile Interface Anyone?

by Charlie Owen -
What about some kind of javascript show/hide solution? The entire page can be loaded and then only certain sections shown, similar to the block collapse function already in Moodle. If the code is written correctly it will degrade gracefully and will not hinder people with js disabled - it would instead show all the options on one page.
Average of ratings: Useful (1)
In reply to N Hansen

Re: New Profile Interface Anyone?

by Darren Smith -
From a personal point of view I know I would prefer the one page layout. I tried the control panel from Michael and I just got frustrated by the additional clicks to get where I wanted.

That said however, I feel the additional clicks / tabs would be justified for our (most?) younger students as they often appear like deers in headlights when they see the long Moodle settings pages.

Which titles do you think would be more meaningful?

Darren
In reply to Darren Smith

Re: New Profile Interface Anyone?

by N Hansen -
My students are adults. So they probably have longer attention spans thoughtful. I think something like "Personal information" (and you might want to group some of the material that appears below the "description" here), "Email and Forum Settings/Preferences" and "Contact Information" (removing the personal information to above). In fact, maybe just two tabs-one for personal/contact information and the other for email and forum settings would be sufficient.
In reply to N Hansen

Re: New Profile Interface Anyone?

by Julian Ridden -
The audience is an important factor in this instance.

I prefer the tabbed formats as my Students are all children/young adults. Also, as we are a school, I do not need them to fill in the extra information. All that is needed for me is the info under the first tab.

Becasue of this it makes the tabbed solution light years ahead in useability and scalability for ME in MY enviromnent and suiting MY needs.

I however understand that dealing with adults and particularly adults in a purely online environement has a completely different set of needs and a different definition of usability (I hate the word, but it fits here) than myself.

So, I do not really know the best answer here. Obviously whatever is built needs to meet the needs of "most" users. But who or what they are I really woundn't know.