small project for a designer to start with!

[denise]

I've been horribly remiss about posting design opportunities, but this started to annoy me tonight while I was working on something else, so I opened a bug for it:

Bug 4304: email posting setting should get some updates

This is the "Email Posting" setting on the Mobile tab of Account Settings, and it's horribly dated-looking. If anybody wants to try your hand at a new version, have at it! Even just a rough mockup would be awesome. Some suggestions are in the bug, but generally I'd like to streamline the layout, eliminate all the duplicated text, and fix the horrible alignment glitches produced by the checkboxes, as well as using some AJAXy goodness to only show one additional (non-used) entry box at a time.

Comments

[sophie]

A thought that I'm having: The screenshot says "one of your confirmed email addresses". If by that it means a validated email address on the account, then it's probably better to use a dropdown or similar rather than a text box.

[marahmarie]

But what if it actually means this?

Allowed sender addresses

Only the addresses listed below are allowed to post to your account via the email gateway. If no addresses are listed, you won't be able to post via the email gateway. We'll send errors only to the address(es) you've selected.

A "confirmed email address", as I understand it, is not the same thing as an "allowed sender" address. If I'm to take both pages at face value, you cannot post by email without 1) having a confirmed email address *and* 2) listing an "allowed sender" address on that one page, yet nowhere does any page state that you'll need to complete both tasks before you can post by email.

edit Forgot to add that other than trying to figure out what's meant by "confirmed" as opposed to "approved", and why it isn't mentioned on any one page that both sorts of email addresses are needed, that your idea is good - it should be a dropdown for confirmed addresses, imo.

I looked at the HTML in Web Dev's live HTML editor, thinking I'd try my hand at the dropdown box myself, and while the little checkboxes are lining up OK for me, I can see why they might not for some people, since the HTML seems a little inconsistent.

From the bug: * maybe make it a table so we can dispense with all that repeated text?

It's already a table, so that might be a problem. :)

[oyceter]

So I'm a little confused by the page (have never posted by email). By going through the FAQ, my understanding of the process is:

1) Create a PIN for email posting
2) Add email addresses you are allowed to post from
(does checking "email summary" send the email summary just once? And "send errors" means it will send an email any time you post via email and there are errors?)
3) You can now post to your journal using [[username]]+PIN@post.dreamwidth.org from any of the added emails

[denise]

your understanding is correct! checking email summary sends the summary once. "send errors" means that anytime there's an error you get sent a copy of it via email.

[oyceter]

Cool, thanks! Will try to get a mockup out in the next few days.

[jewelfox]

Here's a photo of a horrible sketch of a mockup, that I took instead of scanning it because my mate's sleeping right now. >.>

It replaces the text at the top with just "Email posting options," because those are the only options available there right now. The descriptive text just reads "You can post to your Dreamwidth journal by email." The link to the help text could go right after that if needed.

After that, it's divided into two sections with bold headers:

"First, confirm your email address." And below that, "A confirmation email will be sent to this address." The AJAXed dialog underneath includes a text entry box with gray example text, and underneath that it reads "Also send: Error reports?" and "Summary of posting instructions?" with a checkbox after each question mark.

A button underneath that dialog reads "Add another?" and creates a new, identical dialog when pressed.

"Second, choose a PIN number." The 'number' part there is probably redundant, but oh well. Below that, it reads "You'll email your posts to an address which includes this number." The AJAXed dialog reads "Email posts to: yourname(replace with the person's username)+ [text entry box]@posts.dreamwidth.org", and the help text underneath reads "Hints: Use letters and numbers! Make it longer than four characters!"

A button underneath that is labeled "Confirm," and below the button (far enough away that it's not seen as being a part of the form) is a link to "Advanced Setup Options". I also put the link to more detailed instructions down there, but it can go at the top beside the main help text if needed, maybe as just "More instructions ... "

Sorry for the poor-quality mockup. I need to learn an actual graphics program someday. >.>;;

[denise]

Hee. You should see my initial pencil sketches for what became the new update page... (I thought I had them uploaded somewhere but I can't find them! Oh well.)

Thank you for the sketch! I like the way you divided it into task-based bits. Hopefully between that and oyceter's redesign we should be able to make this a little bit more sleek :)

[jewelfox]

Thanks, and good luck (._.)b

I'd like to help some more with design if possible ... are there any other open bugs or opportunities like this, and/or tutorials that might help?

[denise]

Yes! We have a "needs-design" flag in Bugzilla -- open needs-design bugs -- that gets used for both "needs visual design" and "needs UI/UX design". Sometimes it's thrown onto bugs as a "auuuugh I know this thing is worth doing but I have no freakin' idea what it might look like", and sometimes it's "I want us to do this but I haven't the faintest idea how it might work", and sometimes it's "here's what this needs to look like but I don't know how to cram all that information onto the screen without being confusing", so there are a few different senses of 'design' being used there, but maybe something in there will interest you!

In general, we are more than happy to take sketches, wireframes, or mockups to improve anything on the site. The UI is pretty dire in some places.

[jewelfox]

Okay ... I'll look into that, thanks. >.>b Is there anyplace to submit new designs for things that aren't listed there, or would I just open a bug report as a feature request? (Or submit to dw_suggestions.)

[denise]

Probably easiest to run it through suggestions!