Closed Bug 595914 Opened 14 years ago Closed 11 years ago

Student Reps Registration Page redesign

Categories

(Marketing :: Design, task, P2)

Product:
Marketing
Component:
Design
Platform:
x86
macOS
Type:
task

Tracking

(Not tracked)

Status:
RESOLVED FIXED

People

(Reporter: emurto, Assigned: jslater)

Details

Attachments

(3 files)

Student Reps Registration Page redesign, PROOF
1.05 MB, application/zip
Details
Student Reps Registration Page redesign, PROOF Two
737.97 KB, application/zip
Details
Student Reps Registration Page redesign, PROOF Three
1.08 MB, application/zip
Details 
Please help us redesign the studnet reps registration form page. 

Here is current content and registration page that it will be replace: 
http://mozilla.us1.list-manage.com/subscribe?u=168bf22f976f5a68fe5770d19&id=9e35bff4f4

Form fields:
First Name
Last Name
Email address
School
Major (subject of study)
Graduation year (picklist) 
Country (picklist)
Tell me more about  (check boxes "Localization opportunities" and "Developer news (web, mobile, add-ons, applications)

Deadline: would love a design by Friday 9/17/10 if possible. 

This would be implementated in Responsys (rather than Mailchimp) 

Thank you, Eve
Priority: -- → P2
Hi Eve. The current registration page has a *ton* of explanatory copy around what student reps are and why someone should become one. 

I'd like to base this page on https://www-trunk.stage.mozilla.com/en-US/newsletter/, which has a lot less copy and is generally more straightforward. Is that ok? 

If so, here's what we'll need (asap) to have this ready by Friday:
- headline & subheadline copy
- name of the newsletter
- sample newsletter image we can use as the hero image

Let me know if you want to discuss further...thanks!
I'm definitely ok with using a lot less copy. In addition to being a newsletter signup, this page is also how students register to become a Rep. We can make that clear in shorter copy though. Here's what I'm thinking:

Headline: Be a Student Rep at School (let me know if this is too long)

Subheadline: Show your classmates why Firefox rocks, and help others have a better Web experience. Become a Student Rep at your school by signing up now.

Name: Mozilla Student Reps

Sample images: Here are three. Pick the one you think is best: http://people.mozilla.com/~williamr/studentreps/newsletter-heros/
John: lets chat quickly with William to figure out one page or two ... 

As William mentions, this is the main web page about the student reps program, and as such it would be great to offer several paragraphs about the program about what it is and the benefits. (plus other exciting stuff on the page like a campus photo of an event, or a quote from a student rep, a map, etc.). 

Plus can also offer the rather short registration form (to apply for the program) on the same page, or as a click thru to a second form page. What is your preference? 

Frequently form signups are higher by having the form on the side or bottom of a key page, rather than a click thru to another page, by the way.  But either way.
Yeah, I think I misunderstood the page at first. Would love to have a quick discussion.
Thanks Rhonda. A few thoughts on this:

- the page feels kind of unbalanced with all the text on the left but nothing much on the right. I suppose one option would be to use a more vertical illustration to fill the space (wasn't there a guy holding a trophy?). Another might be to make the fields themselves more horizontal...have the name, email and school ones on the left, and then the drop downs, check boxes and buttons right next to them on the right (under the current illo)...a two column approach, basically. Would be great to see both as options, or anything else if you have other ideas.

- it is possible that some of the layers are turned off in the illustration? Comparing this to the one on http://studentreps.mozilla.org/en/ there are some details missing.

- can we put "Become a Student Rep!" all on one line? That might also help scoot things up a bit.

- also, this might not matter much now, but the font stylings on this page are a little different than the live site (see http://www-trunk.stage.mozilla.com/en-US/newsletter/ for reference).

William, Eve...let us know if you have additional comments. 

Thanks!
Wow, this looks fantastic!  Beautiful job. 

When the creative is final ... we'll be implementing this as a form in Responsys (rather than on Mozilla.com web site), so we can grab the HTML and import it easily into the form.  Will have Steve Garrity help us out with this next week.  

We'll need access to the graphics and art images. 

We'll use all 3 pages in the implementation in Responsys. Definitely the confirmation note, and I'll check on the error note operations.   thank you!  -Eve
PROOF 2 includes 2 different versions, using 2 different illustrations. One version is layed out more horizontally and saves some room in the length of the page, while the other has more of a vertical form with all info in one column.
Thanks Rhonda. I'm leaning towards version 1 (the vertical one). My only suggestion there would be to add a little drop shadow or something under the illustration...right now he's kind of floating there. Maybe scoot him down a couple of pixels, too.

William, Eve...any other thoughts or comments?
Proof Three incorporates change to illustration, added drop shadow and moved down a few pixels. If this is good to go I will post the layered PSD file.
Looks good to me! It might be nice to see a *little* more drop shadow underneath him but that's not a huge deal. I'm ready to sign off on this...it's really William's page, though, so I'd love to hear from him too.

William, final thoughts?
I prefer the vertical form a little more than horizontal.  -Eve
Proof three looks good, especially with the spacing and layout changes compared to proof one. I like the trophy character as well. I would add a *little* more drop shadow underneath the character as John suggested.

I'm noticing we're using the mozilla.com template right now. I'm wondering if it would make more sense to use the template from the Student Reps site, since that's how students will be getting to this form. It feels a bit weird to me to go from the orange/tan template to the blue template. John, what do you think?

Student Reps site: http://studentreps.mozilla.org/en/

If we want to use the template from the Reps site, the PSD files are here: http://people.mozilla.com/~williamr/studentreps/site-designs/
Let's go with proof 3 using the vertical layout as discussed (with a bit more drop shadow, also as discussed).

I agree that using the student reps template would be better here, but it will probably push back the final file delivery to Monday or so. Is that ok? In the future, please let us know that sort of thing up front - it's definitely an important detail.

Rhonda, let me know if you have any questions about any of the feedback. Thanks!
That sounds good to me. Eve, does that timing work?

Sorry for not mentioning the template earlier -- I didn't think of that until seeing the proofs. I'll definitely keep that in mind next time.
Hey John--
If you want to use the student reps template for the background, Im happy to replace it, just need the graphic that you would like me to use instead and I can get that for you probably soonest Monday am? :)
Thanks Rhonda - Monday is fine. The files you need for that background are at http://people.mozilla.com/~williamr/studentreps/site-designs/.

Appreciate it!
Just to be clear, since we're using the Student Reps template, we should use the same brown palette of text colors that appear on the site: http://studentreps.mozilla.org/

Thanks!
The new Student Rep Sign up page proofs are here for review:
http://www.intothefuzz.com/rhonda/student_rep_signup/

thanks!
--rhonda
Looks great to me. William, what say you?
Beautiful! No changes. Thanks so much Rhonda :)

Eve, what's the next step here? Handoff the design file?
The final JPG proofs and layered PSD can be found here for pickup:
http://www.intothefuzz.com/rhonda/student_rep_signup/

:)
Thanks!
--rhonda
 We'll handle pickup shortly.  Thanks! -Eve
Outdated/outstanding bug, closing out. 
Please ping/re-open as needed. Thanks!
Status: NEW → RESOLVED
Closed: 11 years ago
Resolution: --- → FIXED
Outdated/outstanding bug, closing out. 
Please ping/re-open as needed. Thanks!
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: