Closed Bug 957420 Opened 11 years ago Closed 11 years ago

Implement Student Ambassadors landing page

Categories

(www.mozilla.org :: Pages & Content, defect)

Product:
www.mozilla.org
Component:
Pages & Content
Type:
defect
Priority:
Not set
Severity:
normal

Tracking

(Not tracked)

Status:
RESOLVED FIXED

People

(Reporter: malexis, Assigned: kohei)

References

Details

(Whiteboard: [kb=1232559] )

Attachments

(5 files, 3 obsolete files)

Pull Request on GitHub
44 bytes, text/x-github-pull-request
Details | Review
screenshot, registration page
273.18 KB, image/png
Details
screenshot, landing page, mobile
343.39 KB, image/jpeg
Details
screenshot, landing page, tablet
454.24 KB, image/jpeg
Details
screenshot, landing page
717.25 KB, image/jpeg
Details
Designs are complete. Should have PSDs this week.
Whiteboard: [kb=1232559]
From Ty: I readied the PSD, you can grab it from here: https://www.dropbox.com/s/i9zt3ifn55qclhk/FFx_StudentsAmbassadors.psd.zip I also used Font Awesome icons which can be found here: http://fontawesome.io/ Here is the list of icons to include: Email: fa-envelope () URL: fa-globe () Social network glyphs (including some that might be used later on): Facebook: fa-facebook-square () Twitter: fa-twitter () Google+ : fa-google-plus-square () Flickr: fa-flickr () Tumblr: fa-tumblr () YouTube: fa-youtube-play () Instagram: fa-instagram ()
Kate, can you provide URLs for all the links on the page: Firefox OS Become Student Ambassadors CTA Contribute Promote Firefox for Desktop and Android Firefox Student Ambassadors blog Student Ambassadors Wiki MozStudents on Facebook
Flags: needinfo?(knaszradi)
plus: Google+ Find Student Ambassadors in your University or Country Mozilla Contribute Page Mozilla Internships Air Mozilla
Firefox OS: http://www.mozilla.org/en-US/firefox/os/ Become Student Ambassadors CTA: http://www.mozilla.org/en-US/contribute/universityambassadors/ Contribute: http://www.mozilla.org/en-US/contribute/ Promote Firefox for Desktop and Android: https://affiliates.mozilla.org/en-US/ Firefox Student Ambassadors blog: https://blog.mozilla.org/studentambassadors/ Student Ambassadors Wiki: https://wiki.mozilla.org/StudentAmbassadors Firefox Student Ambassadors on Facebook: https://www.facebook.com/Firefox.Student.Ambassadors
Flags: needinfo?(knaszradi)
Google+: https://plus.google.com/u/0/107726964966247240749/about Find Student Ambassadors in your University or Country: https://wiki.mozilla.org/Category:FirefoxClubs Mozilla Contribute Page: In my comment above Mozilla Internships: https://careers.mozilla.org/en-US/university/ Air Mozilla: https://air.mozilla.org/channels/ambassadors/ Thanks! Kate
Taking.
Assignee: nobody → kohei.yoshino
Status: NEW → ASSIGNED
OS: Mac OS X → All
Hardware: x86 → All
A few questions: 1. The entry form page has another wordmark and an ivory-colored theme. http://www.mozilla.org/en-US/contribute/universityambassadors/ Do you want to replace them with the simpler logo and blue-colored theme for consistency with the new landing page design (attachment 8356815 [details])? Or keep the current wordmark and use it also on the landing page? 2. What will be the final URL of this landing page? Some ideas: /firefox/student-ambassadors/ /contribute/student-ambassadors/ /contribute/studentambassadors/ /contribute/students/ The entry form page could also be moved to the new location like this: /firefox/student-ambassadors/join/ <- /contribute/universityambassadors/ 3. Can someone sign in to https://twitter.com/mozstudents, create a timeline widget at https://twitter.com/settings/widgets/new/user, and provide the generated code? Actually I only need a widget ID. I can tweak the design later. https://dev.twitter.com/docs/embedded-timelines
(In reply to Kohei Yoshino [:kohei] from comment #7) > 3. Can someone sign in to https://twitter.com/mozstudents, create a timeline > widget at https://twitter.com/settings/widgets/new/user, and provide the > generated code? As per Bug 941806 Comment 10, I can't use the official Embedded Timelines widget. Will try to implement a custom timeline with.
(In reply to Kohei Yoshino [:kohei] from comment #8) > (In reply to Kohei Yoshino [:kohei] from comment #7) > > 3. Can someone sign in to https://twitter.com/mozstudents, create a timeline > > widget at https://twitter.com/settings/widgets/new/user, and provide the > > generated code? > > As per Bug 941806 Comment 10, I can't use the official Embedded Timelines > widget. Will try to implement a custom timeline with. Yes, we can't use an embedded Twitter widget since it executes their JS onLoad of the page. I also just read that they deprecated the RSS/Atom feeds. It looks like we will have to use the Twitter API. I didn't realize Twitter removed it this year. :-/
I'm also reading the latest doc. Twitter API 1.1 needs oAuth and we have to register as a developer, load the timeline in background (maybe using cron?) to hide the secret key. It's more complicated than before. Probably such a library is needed: https://pypi.python.org/pypi/django-twitter-api
(In reply to Kohei Yoshino [:kohei] from comment #10) > I'm also reading the latest doc. Twitter API 1.1 needs oAuth and we have to > register as a developer, load the timeline in background (maybe using cron?) > to hide the secret key. It's more complicated than before. Probably such a > library is needed: https://pypi.python.org/pypi/django-twitter-api Kohei: Hmmm. this is more complicated than I thought and I don't want a bunch of moving parts with this one. Let's ask Kate if we skip the Twitter feed for this phase given the complexities we have discovered and why the widget is also not an option. Katherine: We have discovered that Twitter removed their public feeds that prevent us from easily pulling in Twitter feeds without more moving parts and technology. Just like facebook, they are making it difficult for people to use their feeds without using their widgets. We can't use their widget because of privacy issues of loading 3rd party social tools on our websites.
Flags: needinfo?(knaszradi)
Chris, understood, please move forward with only posting a link to the page. For future reference, how much longer would it take to implement this feature given the new complexities? Kohei, to answer some of your questions above: 1. Let's move forward with replacing the word-mark and theme on the registration page with the simpler logo and blue-colored theme for consistency. Would this involve this page needing to be offline for any amount of time? 2. The final URL of the landing page will be: ambassadors.mozilla.org We will need re-directs to this site from 'fsa.mozilla.org' and 'students.mozilla.org' as well I believe let's keep the registration form where it is for the time-being unless we can re-direct those who use the old link (as it's already been advertised)? Chris, I'd love to get your thoughts on this. Thanks!
Flags: needinfo?(knaszradi)
(In reply to Katherine Naszradi [:knaszradi] from comment #12) > Chris, understood, please move forward with only posting a link to the page. > For future reference, how much longer would it take to implement this > feature given the new complexities? Looks like there are some existing Python libraries to fetch Twitter data, so once Mozilla registers for Twitter as a developer and gets an API key, it won't take long, I think. > Kohei, to answer some of your questions above: > > 1. Let's move forward with replacing the word-mark and theme on the > registration page with the simpler logo and blue-colored theme for > consistency. Would this involve this page needing to be offline for any > amount of time? Okay, I'll tweak the registration page's design. No outage needed. > 2. The final URL of the landing page will be: ambassadors.mozilla.org > We will need re-directs to this site from 'fsa.mozilla.org' and > 'students.mozilla.org' as well Bug 941881 says the landing page will also be added to www.mozilla.org, and those sub-domains will redirect to that page. Which is correct?
Blocks: 941881
The final URL of this page will be www.mozilla.org/something. All other domains including ambassadors.mozilla.org, fsa.mozilla.org, and students.mozilla.org will be 301 redirected to the page on mozilla.org. This has been discussed multiple times and sorry for the confusion. Kate: Can you decide the /something part of the URL on mozilla.org?
/contribute/studentambassadors/ sounds good to me
Got it.
Attached file Pull Request on GitHub —
Attached image screenshot, landing page (obsolete) —
I sent a PR without a Twitter timeline for now. I'll try to implement it later.
Applied the sky theme to the registration page.
Attached image screenshot, landing page, mobile (obsolete) —
Attached image screenshot, landing page, tablet (obsolete) —
Hi Kohei, this all looks awesome - thanks for all of your effort to put this together. Next steps?
I'm trying to fix a few minor issues on the form to enhance the usability, then the pages will be live on the production site, and the redirects from ambassadors.mozilla.org etc. will be set up.
Here are updated screenshots.
Attachment #8358722 - Attachment is obsolete: true
Attachment #8358757 - Attachment is obsolete: true
Kate: Can you confirm that this page will be en-US only and if not, can you provide guidance?
Flags: needinfo?(knaszradi)
Chris, confirmed - it will only be in en-US. Thanks!
Flags: needinfo?(knaszradi)
(In reply to Katherine Naszradi [:knaszradi] from comment #27) > Chris, confirmed - it will only be in en-US. Thanks! Hi should we also redirectstudentsreps.mozilla.org to point to this new page instead of the wiki page at https://wiki.mozilla.org/ReMo/Student_Reps?
Flags: needinfo?(knaszradi)
Yes please. Thanks.
Flags: needinfo?(knaszradi)
I've leaving this comment as note to take down the wiki page at https://wiki.mozilla.org/ReMo/Student_Reps or possibly redirect the wiki page link to the new one when we push to production
I'm working on the remaining Twitter timeline part. I've installed a Python library, got an API key for test, and been able to show tweets on the page. Still needs some CSS work to comply with the Display Requirements: https://dev.twitter.com/terms/display-requirements Accepting the API terms is up to the legal team: https://dev.twitter.com/terms/api-terms
Implemented a Twitter timeline with the Twitter REST API + a Python library.
Attachment #8358719 - Attachment is obsolete: true
Looks awesome! What else needs to be accomplished before it can be launched?
We are almost there! Next: final code review, deploy to the production server, set redirects in Bug 941881.
Fantastic! Do you have any timing estimates for when it can be launched?
Commits pushed to master at https://github.com/mozilla/bedrock https://github.com/mozilla/bedrock/commit/4580d344522028c85cee2bb2fd819b34a4ff0ff6 Fix Bug 957420 - Implement Student Ambassadors landing page https://github.com/mozilla/bedrock/commit/416623592ca307855ff5e823e78be60decec7804 Merge pull request #1584 from kyoshino/bug-957420-student-ambassadors FIx Bug 957420 - Implement Student Ambassadors landing page
Status: ASSIGNED → RESOLVED
Closed: 11 years ago
Resolution: --- → FIXED
The landing page has been merged to the development server, will be merged to the production server soon. https://www-dev.allizom.org/en-US/contribute/studentambassadors/ I have separated the Twitter timeline widget from my initial commit, so I'll file a new bug for that.
Depends on: 965823
this looks incredible!
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: