Closed Bug 601147 Opened 15 years ago Closed 15 years ago

Student Reps Registration Page

Categories

(www.mozilla.org :: General, defect)

Product:
www.mozilla.org
Component:
General
Platform:
x86
Windows XP
Type:
defect
Priority:
Not set
Severity:
normal

Tracking

(Not tracked)

Status:
VERIFIED FIXED

People

(Reporter: emurto, Assigned: abuchanan)

References

Details

(Whiteboard: [email][ms-11/18])

Attachments

(1 file)

screenshot from IE6
241.71 KB, image/png
Details
Charles, please help us convert the new design for Student Reps registration page into HTML for our use in Responsys (email campaigning). Design can be found in Bug #595914. Thank you, - Eve
Whiteboard: [email]
Please help us out with the HTML programming for student reps registration page. The final JPG proofs and layered PSD can be found here for pickup: http://www.intothefuzz.com/rhonda/student_rep_signup/ (the designer was Rhonda). thank you! Eve
Assignee: nobody → lorchard
Les, we can talk about where to host this, and how to submit to Responsys, if you want. The Student Reps site lives here, http://studentreps.mozilla.org/en/
So... does this form already exist somewhere, and just needs a re-skin? Or, does the registration flow need to be implemented yet?
(In reply to comment #2) > Les, we can talk about where to host this, and how to submit to Responsys, if > you want. > > The Student Reps site lives here, > http://studentreps.mozilla.org/en/ Yeah, any info on this you have would be good - all I have to go on are the JPGs and a login to responsys
And this is the current registration page itself (currently in Mailchimp) once you click "signup" link on the right on the page that Alex mentions above. Current registration page: (old version) http://mozilla.us1.list-manage.com/subscribe?u=168bf22f976f5a68fe5770d19&id=9e35bff4f4 thank you, Eve
Starting to dig into building this as form on mozilla.com, and I think there's a slight problem with the design with respect to validation errors: http://www.intothefuzz.com/rhonda/student_rep_signup/moz_studentrep_error.jpg Assuming that all fields are mandatory, what happens when there are multiple validation errors? That little bubble element will show up multiple times and they'll each overlap on each other.
Currently, we only show one error bubble at a time. Not ideal, I know.
(In reply to comment #7) > Currently, we only show one error bubble at a time. Not ideal, I know. Currently... where?
(In reply to comment #8) > (In reply to comment #7) > > Currently, we only show one error bubble at a time. Not ideal, I know. > > Currently... where? http://www-trunk.stage.mozilla.com/en-US/newsletter/ If you leave both the email and privacy checkbox blank, you'll get a message that mentions both fields. That doesn't really scale past two required fields though.
Also, is there a list somewhere of choices for the "Major" and "Graduation year" drop down fields?
(In reply to comment #9) > If you leave both the email and privacy checkbox blank, you'll get a message > that mentions both fields. That doesn't really scale past two required fields > though. Yeah, the error bubble in this design is a bit different. It overlaps on the fields themselves and points directly at a field with an error. That'll both interfere with multiple errors and the fields themselves.
(In reply to comment #11) > (In reply to comment #9) > > If you leave both the email and privacy checkbox blank, you'll get a message > > that mentions both fields. That doesn't really scale past two required fields > > though. > > Yeah, the error bubble in this design is a bit different. It overlaps on the > fields themselves and points directly at a field with an error. That'll both > interfere with multiple errors and the fields themselves. We should use vary from the mockups and use the existing error style. Interfering with filling out the form fields is bad, and that little curvy dotted line is really overkill and probably impossible to implement nicely. Still need to figure out the multiple errors thing. Should we go for showing all errors at once? Or, is one at a time OK? We don't necessarily have to block on that either, we could go with one error at a time for now, and improve it later on.
Yeah, there's an existing style for forms on the student reps site that might work a bit better: http://studentreps.mozilla.org/en/highlights#contact
Eve: So here's a dilemma - the mockup as supplied is a bit awkward. It won't really work without tweaks to the red error bubble with respect to overlapping multiple errors and the fields themselves. And, as Alex noted, that dotted line floating over the fields will be a challenge to get working across browsers. However, the Student Reps site already has a style for forms and validation errors. You can see it in use, here: http://studentreps.mozilla.org/en/highlights#contact In order to move ahead and get something working, I'm going to use styling consistent with that contact form. If we really want to adhere to the mockup styling, I can tweak things after the design is updated to address the validation issues.
Responding to comment #10: There are no menu lists currently for Major and Graduation Year. Major: This is meant to be a free form field - they can put in the topic that they are studying in any way they want. (there are hundreds of topics - too many to list) . Graduation Year: Yes, please set up a picklist for graduation year, starting with 2010 and going for the next 10 years thru 2020. Just spoke to William Reynolds about it, and that sounds fine. Don't need 2009 or earlier, we can start with 2010 as the first pick. thank you! Eve
Les, use the styling you recommend and lets see what it looks like. -Eve
With r76082, I've got the styling and initial signup flow working, but not submitting to Responsys: http://www-trunk.stage.mozilla.com/en-US/newsletter/studentreps/ Eve: Take a look at this and see what you think about the styling. Alex: I need help hooking this up to Responsys. I can see where responsys.php comes in, but I'm not sure what field names to use, etc.
(In reply to comment #17) > With r76082, I've got the styling and initial signup flow working, but not > submitting to Responsys: > > http://www-trunk.stage.mozilla.com/en-US/newsletter/studentreps/ > > Eve: Take a look at this and see what you think about the styling. > > Alex: I need help hooking this up to Responsys. I can see where responsys.php > comes in, but I'm not sure what field names to use, etc. Great, thanks Les. I'm working on some refactoring of the responsys.php code, and I'll commit that today, then I can take a stab at hooking up this form.
(In reply to comment #18) > Great, thanks Les. > > I'm working on some refactoring of the responsys.php code, and I'll commit that > today, then I can take a stab at hooking up this form. Cool... Let me know if it makes sense. I tried making the form processing a little more general, with a bit that maps to Responsys-specific field names. Hopefully that helps and can be reused with some tweaking for other forms like this in the future
I just looked over the design with William Reynolds (student reps)and it looks great. Just one edit: The first name box background color is white and the rest are in light beige. Perhaps make them all the same color. Thank you! -Eve
Also please make United States the default country (not Afghanistan) or else the words "Select your location" or something. Don't leave Afghanistan as the default. I filed other bugs to have the other signup pages on our site adjusted as well. Thank you! Eve
(In reply to comment #21) > Also please make United States the default country (not Afghanistan) or else > the words "Select your location" or something. Don't leave Afghanistan as the > default. I filed other bugs to have the other signup pages on our site > adjusted as well. Go with an empty value and "Select country" to be consistent with the other forms please. e.g. http://www.mozilla.com/en-US/newsletter/
Perfect, thank you! -Eve
(In reply to comment #20) > The first name box background color is white and the rest are in light beige. > Perhaps make them all the same color. They are all the same color, actually. Same style, in fact. I think you're just seeing an optical illusion with respect to the background image.
r76102 adds empty options for both grad year and country, which are also both required fields. Cleaned up a few other bits under the hood as well
Attached image screenshot from IE6 —
The page is currently broken in IE 6
(In reply to comment #26) > Created attachment 485338 [details] > screenshot from IE6 > > The page is currently broken in IE 6 Can you also check http://studentreps.mozilla.org/ in IE6? The style is copied from there - if it's broken too, this is a larger bug if Student Reps is intended to support IE 6
(In reply to comment #27) > (In reply to comment #26) > > Created attachment 485338 [details] [details] > > screenshot from IE6 > > > > The page is currently broken in IE 6 > > Can you also check http://studentreps.mozilla.org/ in IE6? The style is copied > from there - if it's broken too, this is a larger bug if Student Reps is > intended to support IE 6 Checked it myself in a VM - studentreps.mozilla.org looks the same in IE6. That leads me to believe that either IE6 is not supported by the Student Reps site, or this is actually a Student Reps site bug.
(In reply to comment #26) > Created attachment 485338 [details] > screenshot from IE6 > > The page is currently broken in IE 6 And to be clear, the page is *functional* in IE6 - signups should work fine. It's just that the styling is off, along with the rest of the Student Reps site.
(In reply to comment #18) > > Alex: I need help hooking this up to Responsys. I can see where responsys.php > > comes in, but I'm not sure what field names to use, etc. > > Great, thanks Les. > > I'm working on some refactoring of the responsys.php code, and I'll commit that > today, then I can take a stab at hooking up this form. Had a chance to look at this using the new responsys code?
Assignee: lorchard → abuchanan
(In reply to comment #31) > (In reply to comment #18) > > > > Alex: I need help hooking this up to Responsys. I can see where responsys.php > > > comes in, but I'm not sure what field names to use, etc. > > > > Great, thanks Les. > > > > I'm working on some refactoring of the responsys.php code, and I'll commit that > > today, then I can take a stab at hooking up this form. > > Had a chance to look at this using the new responsys code? Not yet, sorry. I did finish and launch my refactoring and some other forms, Student Reps is next on my list, but I've been distracted by another project. If you're up to it, take a peek at the refactored code. It might be easier to understand/use.
The lang switcher in the footer isn't going to work
r76600 - removed the lang switcher (since this is in en-US only), and hooked up the responsys submission alex: Seems to be working without error, and I tried to match up the data fields, but I'm not seeing the data actually end up anywhere I can see in Responsys. Is there further troubleshooting & etc to do? Also, I stuck with the form processing I had thrown together, since there's a lot of validation logic there not yet in the new form classes.
Summary: HTML work - Student Reps Registration Page → Student Reps Registration Page
Keywords: qawanted
Blocks: 613299
r77799 should fix that.
Keywords: qawanted
Whiteboard: [email] → [email][ms-11/18]
looks good on production
Status: NEW → RESOLVED
Closed: 15 years ago
Resolution: --- → FIXED
verified fixed http://www.mozilla.com/en-US/newsletter/studentreps/
Status: RESOLVED → VERIFIED
Component: www.mozilla.org/firefox → www.mozilla.org
Component: www.mozilla.org → General
Product: Websites → www.mozilla.org
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: