Bugzilla – Bug 13173
improper visual formatting on newsletter signup form
Last modified: 2009-12-14 00:22:11 UTC
need a page that prompts signup to our newsletter after downloading Squeezebox Server.
Let's chat about this -- the wireframe on the wiki should probably be re-worked. Since country / language / first & last name are already known, suggest by default these are pre-filled in disabled elements with text "[ English ] __change my language__" rather than require re-entry of data that is already know. The trick with "name" is SN only knows a full name string, and we can only guess the order to fill "First name" and "Last name".
__change my XXX__ should enable the form input and allow the values to be overridden from the existing known values. Also, email should be prefilled in addition to country / language / first & last name. We can remove "preferred format" since the system sends multi-part and they will automatically get the right version.
Created attachment 5550 [details] proposed newsletter signup form
Created attachment 5551 [details] proposed newsletter signup form illustrating "change" behavior for language
"Why do you need this?" would be a simple tooltip appearing on hover that says: "We occasionally invite our community members to regional Squeezebox related events, such as our annual open-house here in Mountain View, CA. Providing your postal code helps us send you the most relevant information for your area."
(In reply to comment #5) > "Why do you need this?" would be a simple tooltip appearing on hover that says: > > "We occasionally invite our community members to regional Squeezebox related > events, such as our annual open-house here in Mountain View, CA. Providing your > postal code helps us send you the most relevant information for your area." err, rather "Mountain View, California"
Form behavior: - User must select at least one checkbox for "Which types of info..." - User must enter something in zip / postal code (EXCEPT Ireland.. any others without postal code?) - JavaScript should detect for valid US (5 or 5+4 using dash or space) & CA zip codes
Can we keep this simple for an initial release? We have way too many things to implement in the next few weeks. No need to go Premium Gold everywhere...
I was imagining we would just mimic what has been built already for logitechsqueezebox.com? That's what I was going to design anyway. A basic "installing Squeezebox Server" section plud the same signup form we use today... it doesn't even have to be a popup, just a static page.
(In reply to comment #1) > Let's chat about this -- the wireframe on the wiki should probably be > re-worked. > > Since country / language / first & last name are already known, suggest by > default these are pre-filled in disabled elements with text "[ English ] > __change my language__" rather than require re-entry of data that is already > know. > Country and mane won't be known. You don't have to be logged in to get to this screen. > The trick with "name" is SN only knows a full name string, and we can only > guess the order to fill "First name" and "Last name".
The problem with the way it works on LogitechSqueezebox.com is that it's not localized (especially the success / error messages when the form posts to newsletter.slimdevices.com). The localized version will need to use the XML API which is more than just a simple HTML form. Let's do English only for now and use the existing assets from LogitechSqueezebox.com. We'll make a localization pass on this when there's time to do it the right way.
Michael, the form with validation JS (and some jQuery JS I mentioned) is in SVN: /websites/branches/web-refresh/www.logitechsqueezebox.com/subscribe_form.html
Should I hold off doing any design work on this? Theoretically, Matthew, if you know what you want, and I provide assets/styles to Michael soon, my work on this one should actually be pretty minimal, no? (Another one you might want to take a look at is the "support" page, which is static and mainly contains strings from Angela. I was just going to provide a layout)
Yes, the design work is minimal. It's the implementation that complicates things. Basically we need to have the entire interaction reside on MySB.com ... using the existing method (as seen on LogiSB), this is not possible and l10n won't work. To do it the right way (localized), MySB needs to call the XML API which will take significantly more time to implement and test (yet another ground-up bit of code needed to launch which will need QA etc..., not re-using something that is already working). Given the time-frame, I would propose deferring the "proper" implementation in favor of an English-only (only appearing for English users) to put more time on other high-priority stuff needed for launch. So far the actual newsletters going out have been English only, so this isn't terrible from a business perspective that we defer a localized opt-in until we have the mechanisms to support it. Alternatively, we could display the English-only opt-in for all users, but that is a sub-optimal experience. I'll chat about this with the marketing crew tomorrow and see what the consensus is from Sam, Seth, and team. On Mon, Aug 3, 2009 at 4:10 AM, <bugs@bugs.slimdevices.com> wrote: > https://bugs-archive.lyrion.org/show_bug.cgi?id=13173 > > > > > > --- Comment #13 from Weldon Matt <mweldon@slimdevices.com> �2009-08-02 21:10:54 --- > Should I hold off doing any design work on this? > > Theoretically, Matthew, if you know what you want, and I provide assets/styles > to Michael soon, my work on this one should actually be pretty minimal, no? > > (Another one you might want to take a look at is the "support" page, which is > static and mainly contains strings from Angela. �I was just going to provide a > layout) > > -- > Configure bugmail: https://bugs-archive.lyrion.org/userprefs.cgi?tab=email > ------- You are receiving this mail because: ------- > You are on the CC list for the bug. >
> The localized version will need to use the XML API which is more than > just a simple HTML form. What XML API?
http://idn.interspire.com/articles/27/1/Interspire-Email-Marketer-XML-API-Documentation/Page1.html On Mon, Aug 3, 2009 at 6:41 AM, <bugs@bugs.slimdevices.com> wrote: > https://bugs-archive.lyrion.org/show_bug.cgi?id=13173 > > > > > > --- Comment #15 from Michael Herger <michael@slimdevices.com> �2009-08-02 23:41:37 --- >> The localized version will need to use the XML API which is more than >> just a simple HTML form. > > What XML API? > > -- > Configure bugmail: https://bugs-archive.lyrion.org/userprefs.cgi?tab=email > ------- You are receiving this mail because: ------- > You are on the CC list for the bug. >
> http://idn.interspire.com/articles/27/1/Interspire-Email-Marketer-XML-API-Documentation/Page1.html That's the backend on logisb.com we should use from the mysb.com backend to subscribe users? Got that. But then... let's make this P5. Please. We have a working form. Let's reskin it as needed and stick it into an iframe. Technically ugly, but efficient. And then let's do what mysb.com should do: let the user control his Squeezebox.
Sam Feng is OK with english only for now -- per him I will add messaging on that form (the one you'll grab in iframe) indicating newsletter is English only for the time being.
Matthew/Matt - what's the latest news on this feature? What do I need to implement? What are you going to do (reskin existing form)?
Ping Matthew/Matt...
Use this: http://www.logitechsqueezebox.com/subscribe_newsletter.php I'm opening a new bug that the track skin on confirm / error messages which is broken.
done: http://test.squeezenetwork.com/user/newsletter we might need some introductiory text at the top
Finally had time to fully review this. I actually think the existing page is great. If we have time, it would be nice to switch to the "long" form layout style (see attached) for the form (so it localizes a little better). But the existing layout should work OK if we don't have time to make that change. Also note that I've left in the current "install" instructions (Michael, background box has #e3e3fd background and #999999 border), all we need to do here is change the wording from "SqueezeCenter" to "Squeezebox Server."
Created attachment 5703 [details] reference screen Also added reference image here http://embargo.wiki.slimdevices.com/index.php/Mysqueezeboxdotcom#2b_My_Music_-_Thanks_for_Downloading.21
Assigned to Michael, not sure if that's right, but my work should be done on this bug, so it's between Michael and Matthew to implement now.
Matthew - could you please provide me with the CMS key for that install instruction box?
Last I looked at this we decided to use an iframe: > Use this: http://www.logitechsqueezebox.com/subscribe_newsletter.php > If you want to pull this from the CMS instead of an iframe, use: NEWSLETTER-SUBSCRIBE-FORM
(In reply to comment #27) > Last I looked at this we decided to use an iframe: that's what we are apready doing. But Matt wnted to have a "getting started" box. Are you going to handle this too?
Ah, OK I see this, now -- the instructional text on the left. I need to create this.
Matt Weldon -- can you please attach the sidebar as plain-text or a word doc? Thanks!
Installing Squeezebox Server Windows After downloading, open the installer application and follow the on-screen instructions. Mac OS X After downloading, open the DMG file that appears on your desktop and double-click the Squeezebox Server Installer icon to install the software. Linux, Solaris, & BSD If you've previously installed SlimServer, SqueezeCenter or Squeezebox Server, you should uninstall it before installing the new version. Your system should be running Perl version 5.8.4 or later. To determine what version of Perl you are running, type 'perl -v' from the command line. You can download the latest version from www.perl.com. You can read the Squeezebox Server change log here.
Added installation notes, minor copy tweaks on change-log messaging to use Logitech brand voice. Michael: position: INSTALLATION-TIPS title: Installing Squeezebox Server Note that I have <h2>Installing Squeezebox Server</h2> Do you want this in the markup, or will you use the title data from JSON? Let me know if you want it removed before I send to SLT.
== Auto-comment from SVN commit #7395 to the network repo by michael == == https://svn.slimdevices.com/network?view=revision&revision=7395 == Bug: 13173 +1 Description: implement "installing server" text block on success page.
Matt - we need to review the color schema on that page. It's currently a mix of new mysb.com colors and logitechsqueezebox.com. Could you please give precise instructions about the font, box background and border colors? Thanks! Matthew - you'll probably have to implement these on logisb.com for that frame too.
Matthew - one more thing: could you please remove the line breaks from that text block? We should let the text flow as it hardly ever will perfectly match the planned layout.
(In reply to comment #35) > Matthew - one more thing: could you please remove the line breaks from that > text block? We should let the text flow as it hardly ever will perfectly match > the planned layout. Done. Sorry I missed those.. thought I caught them all. Should be good, now.
The title of the screen is supposed to read "Thanks for downloading Squeezebox Server!" The header area (white text over black) should read "Subscribe to our newsletter," and the page title should be "Subscribe to our newsletter - mysqueezebox.com" All the copy on this screen from the title downwards should be BLACK (including all of the web form), with the only exception being the "Windows," "Mac OS X" and "Linux, Solaris, & BSD" subheaders, which should be #666666. Paragraph copy (including text in the web form) should be Arial, Helvetica, sans-serif 13px #000000.
Michael, you should be able to do this based on what I have in the CMS. Reassigning to you to finish implementation. Please let me know ASAP if you need modifications to the content.(In reply to comment #37) Matt, > > The header area (white text over black) should read "Subscribe to our > newsletter," and the page title should be "Subscribe to our newsletter - > mysqueezebox.com" > FYI: your reference screen doesn't reflect this -- shows "My Music" as the reverse-type title of the box.
Matt - fixed titles and Windows et al. font color. Matthew - I'm sorry, I can't change the form's formatting. It's hosted on http://www.logitechsqueezebox.com/subscribe_newsletter.php, the style sheet is templates/LogitechSqueezebox/styles/teal.css from there. These need to be changed.
== Auto-comment from SVN commit #7419 to the network repo by michael == == https://svn.slimdevices.com/network?view=revision&revision=7419 == Bug: 13173 Description: fix heading and sub-title color on newsletter subscription page
Michael: download and store a local copy of this instead of using the iframe. The target is already set to http://newsletter.slimdevices.com/form.php?form=8 so it should work fine to use a local copy which would only apply your stylsheets. Can't change this on LogiSB side since it would break it within LogiSB template.
Only the greyish instead of black color for the form is still open. Considered good enough for this release. Let's review the subscription page post-INXS/7.4
We didn't actually fix this bug, we just punted it. Retargeting for Joplin, also I've edited the title to make the bug currently accurate.
no more newsletter