diff --git a/web/app/assets/images/content/phone-icon.png b/web/app/assets/images/content/phone-icon.png new file mode 100644 index 000000000..fd52859fb Binary files /dev/null and b/web/app/assets/images/content/phone-icon.png differ diff --git a/web/app/assets/images/landing/logo-composite.jpg b/web/app/assets/images/landing/logo-composite.jpg new file mode 100644 index 000000000..ab66248d0 Binary files /dev/null and b/web/app/assets/images/landing/logo-composite.jpg differ diff --git a/web/app/assets/images/landing/logo-composite.png b/web/app/assets/images/landing/logo-composite.png new file mode 100644 index 000000000..e4c970200 Binary files /dev/null and b/web/app/assets/images/landing/logo-composite.png differ diff --git a/web/app/assets/images/landing/student_landing_cta_arrow.png b/web/app/assets/images/landing/student_landing_cta_arrow.png new file mode 100644 index 000000000..6d0df7084 Binary files /dev/null and b/web/app/assets/images/landing/student_landing_cta_arrow.png differ diff --git a/web/app/assets/javascripts/react-components/JamClassPhone.js.jsx.coffee b/web/app/assets/javascripts/react-components/JamClassPhone.js.jsx.coffee index 99f7c91f5..92135e55f 100644 --- a/web/app/assets/javascripts/react-components/JamClassPhone.js.jsx.coffee +++ b/web/app/assets/javascripts/react-components/JamClassPhone.js.jsx.coffee @@ -4,8 +4,17 @@ context = window { displayName: 'JamClassPhone', + getInitialProps: () -> + { + customClass: null + } render: -> - `
+ classes = {"jamclass-phone": true} + + if @props.customClass? + classes[@props.customClass] = true + + `
diff --git a/web/app/assets/javascripts/react-components/landing/JamClassSchoolLandingBottomPage.js.jsx.coffee b/web/app/assets/javascripts/react-components/landing/JamClassSchoolLandingBottomPage.js.jsx.coffee index e484f20f6..9c483cbd6 100644 --- a/web/app/assets/javascripts/react-components/landing/JamClassSchoolLandingBottomPage.js.jsx.coffee +++ b/web/app/assets/javascripts/react-components/landing/JamClassSchoolLandingBottomPage.js.jsx.coffee @@ -325,13 +325,13 @@ rest = context.JK.Rest()

What Does Your School Need to Host JamClass Lessons?

- At a mininum, you need:

+ At a minimum, you need:

  • A computer running either
      -
    • Windows 7 or a later version (32-bit or 64-bit) +
    • Windows 7 or a later version
    • -
    • Mac OS X 10.7 or a later version (64-bit)
      +
    • Mac OS X 10.7 or a later version
      how do I know which version I'm running and if it's 64-bit on Mac?
    • @@ -345,13 +345,12 @@ rest = context.JK.Rest()

      To have very high quality audio in your sessions, rather than using the built-in microphone on your computer - to capture your instrumental and/or vocal audio, we strongly recommend using an external audio interface. An + to capture your instrumental and/or vocal audio, we recommend using an external audio interface. An audio interface is a hardware product that connects to your computer and processes audio better than your computer alone. If you already own/use an audio interface, you can use the one you have. And if you don't, - please read this help article on audio interfaces that can guide you to get what you - need. You can pick up a perfectly good interface very inexpensively, typically for less than $50. And you can - use your new interface not just for JamClass, but also to make home recordings of your performances, etc. So + please refer to this set of help articles that recommend the best gear based on your instruments and/or vocals. You can pick up a perfectly good interface very inexpensively, typically for less than $50. And you can + use your new interface not just for JamClass, but also to make home recordings of your performances, and also to play in online JamKazam sessions with other musicians. So it's a great thing to have for any musician.

      diff --git a/web/app/assets/javascripts/react-components/landing/JamClassStudentLandingBottomPage.js.jsx.coffee b/web/app/assets/javascripts/react-components/landing/JamClassStudentLandingBottomPage.js.jsx.coffee index a204cdd44..38cf6e4c3 100644 --- a/web/app/assets/javascripts/react-components/landing/JamClassStudentLandingBottomPage.js.jsx.coffee +++ b/web/app/assets/javascripts/react-components/landing/JamClassStudentLandingBottomPage.js.jsx.coffee @@ -11,13 +11,21 @@ rest = context.JK.Rest() `

      What Now?

      -

      If you're ready to sign up for your free lesson, just scroll back up to the top of this page, and sign up. Once you've done this, there are three more things to do:

      +

      If you're ready to sign up for your free lesson, just scroll back up to the top of this page, and sign up. + Once you've done this, there are three more things to do:

        -
      1. Search for the instructor who looks best for you, and book your lesson with him or her.
      2. -
      3. Work with a JamKazam staff person, who will give you all the 1:1 help you need to get set up and ready for your online lesson.
      4. -
      5. Enter your credit card information. You will not be charged unless you choose to book more lessons after the first free one. We have to collect credit card info to avoid fraud. Unfortunately we've found that some folks will keep signing up with new accounts to keep getting free lessons.
      6. +
      7. Search for the instructor(s) who look best for you, and book your lesson with him or her.
      8. +
      9. Enter your credit card information. You will not be charged unless you choose to book more + lessons after the first free one. We have to collect credit card info to avoid fraud. Unfortunately we've + found that some folks will keep signing up with new accounts to keep getting free lessons. +
      10. +
      11. Work with a JamKazam staff person, who will give you all the 1:1 help you need to get set up and ready + for your online lesson. +
      -

      While you're getting this done, if you want to learn more about all the nifty features you can access in JamClass and in JamKazam in general, you can check out our online JamClass User Guide.

      +

      While you're getting this done, if you want to learn more about all the nifty features you can access in + JamClass and in JamKazam in general, you can check out our online JamClass + User Guide.

      ` else find_teacher_header = "TestDrive to Find the Right Teacher" @@ -25,24 +33,32 @@ rest = context.JK.Rest() find_teacher_text = "And whether traditional or online, students often just settle on the first teacher they try, as it's hard and expensive to \"try out\" multiple teachers. Our unique TestDrive program lets you try lessons with 4 different teachers for just $49.99. Then you pick the one with whom you find that you work best. It's inexpensive, easy, and no one gets their feelings hurt." what_now = `
      -

      What Now?

      +

      What Now?

      -

      If you're ready to sign up for TestDrive, just scroll back up to the top of this page, and sign up. Once - you've done this, there are three more things to do:

      -
        -
      1. Search for the 4 instructors who look best for you, and sign up for a TestDrive lesson with each of them.
      2. -
      3. Work with a JamKazam staff person, who will give you all the 1:1 help you need to get set up for online lessons.
      4. -
      5. Plug in your credit card info to pay for your TestDrive
      6. -
      -

      While you're getting this done, if you want to learn more about all the nifty features you can access in JamClass and in JamKazam in general, you can check out our online JamClass User Guide.

      -
      ` +

      If you're ready to sign up for TestDrive, just scroll back up to the top of this page, and sign up. Once + you've done this, there are three more things to do:

      +
        +
      1. Search for the 4 instructors who look best for you, and sign up for a TestDrive lesson with each of + them. +
      2. +
      3. Work with a JamKazam staff person, who will give you all the 1:1 help you need to get set up for online + lessons. +
      4. +
      5. Plug in your credit card info to pay for your TestDrive
      6. +
      +

      While you're getting this done, if you want to learn more about all the nifty features you can access in + JamClass and in JamKazam in general, you can check out our online JamClass + User Guide.

      +
` `
-

What Makes JamClass Awesome?

+

What Makes JamClass Lessons Awesome?

Online music lessons offer obvious advantages. Connecting with the right teacher is the most important factor in the value of lessons, yet with traditional lessons, you have to settle for a teacher who lives close to you - rather than selecting the best teacher. {test_drive_point} Travel to and from lessons takes far more time than the lessons + rather than selecting the best teacher. {test_drive_point} Travel to and from lessons takes far more time than + the lessons themselves. You often forget important teachings and demonstrations between lessons. The list goes on, as traditional lessons have many drawbacks.

@@ -50,7 +66,7 @@ rest = context.JK.Rest() music teachers, but every one of these companies relies on Skype or similar apps – built for voice conferencing – to deliver online lessons. This is a major problem. The voice technology of these apps makes music sound awful in online sessions – so bad that teachers can’t assess the student’s tone and sometimes even - the pitch of what they are playing, and so bad that it steals away the joy of playing music. These apps also + the pitch of what they are playing. These apps also have very high latency – a technical term that means that the student and teacher cannot play together, another critical requirement for productive lessons. Since Skype wasn’t built for music, it also lacks many other basic features to support effective lessons, like a metronome, support for backing tracks, etc.

@@ -65,40 +81,49 @@ rest = context.JK.Rest()

JamClass Kudos

- +

Julie Bonk

+
Oft-recorded pianist, teacher, mentor to Grammy winner Norah Jones and Scott Hoying of Pentatonix
- +

Carl Brown of GuitarLessions365

- +

Justin Pierce

+
Masters degree in jazz studies, performer in multiple bands, saxophone instructor
- +

Dave Sebree

+
Founder of Austin School of Music, Gibson-endorsed guitarist, touring musician
- +

Sara Nelson

+
Cellist for Austin Lyric Opera, frequently recorded with major artists
@@ -183,13 +208,15 @@ rest = context.JK.Rest()
-
Lessons with 4 instructors for just $49.99. A phenomenal value. You - wouldn't marry the first person you ever date, right? +
Try more than one instructor. You wouldn’t marry the first person you date, right?
-

Connecting with the right teacher is the single most important factor in the effectiveness of lessons. - But with traditional lessons, you are stuck choosing a teacher within a 30-minute drive - choosing the - closest vs. the best.{find_teacher_text}

+

Connecting with the right teacher is the most important factor in the effectiveness of lessons. But with + traditional lessons, you are stuck choosing a teacher within a 30-minute drive - choosing the closest vs. + the best. Plus students often just settle on the first teacher they try, as it's hard and expensive to try + out multiple teachers. Our unique TestDrive program lets you try full lessons with multiple teachers at a + discounted rate to find the best teacher for you. It's inexpensive, easy, and it makes a world of + difference in the value of your investment in lessons.

@@ -286,7 +313,7 @@ rest = context.JK.Rest()

8
- And So Much More... + And More…

There are many other features that are specifically useful for online lessons built into JamClass by @@ -310,13 +337,13 @@ rest = context.JK.Rest()

What Do You Need to Play in JamClass Lessons?

- At a mininum, you need:

+ At a minimum, you need:

  • A computer running either
      -
    • Windows 7 or a later version (32-bit or 64-bit) +
    • Windows 7 or a later version
    • -
    • Mac OS X 10.7 or a later version (64-bit)
      +
    • Mac OS X 10.7 or a later version
      how do I know which version I'm running and if it's 64-bit on Mac?
    • @@ -330,16 +357,14 @@ rest = context.JK.Rest()

      To have very high quality audio in your sessions, rather than using the built-in microphone on your computer - to capture your instrumental and/or vocal audio, we strongly recommend using an external audio interface. An + to capture your instrumental and/or vocal audio, we recommend using an external audio interface. An audio interface is a hardware product that connects to your computer and processes audio better than your computer alone. If you already own/use an audio interface, you can use the one you have. And if you don't, - please read this help article on audio interfaces that can guide you to get what you - need. You can pick up a perfectly good interface very inexpensively, typically for less than $50. And you can - use your new interface not just for JamClass, but also to make home recordings of your performances, etc. So + please refer to this set of help articles that recommend the best gear based on your instruments and/or vocals. You can pick up a perfectly good interface very inexpensively, typically for less than $50. And you can + use your new interface not just for JamClass, but also to make home recordings of your performances, and also to play in online JamKazam sessions with other musicians. So it's a great thing to have for any musician.

      -

      If you feel worried or confused about getting set up because you're not a "tech genius", we are happy to work with you 1:1 to answer your questions, and walk you through picking gear and setting it up. We'll even hop @@ -360,21 +385,17 @@ rest = context.JK.Rest()

      We Have Fabulous Teachers, Check Them Out!

      -

      JamClass instructors are a terrific set of teachers from whom you can learn almost anything musically. We run - background checks on all teachers for safety reasons. And we review every single teacher individually to +

      JamClass instructors are a terrific set of teachers from whom you can learn almost anything musically. We review every single teacher individually to ensure they meet high standards in terms of their ability, experience, and desire to teach music.

      -

      When you sign up for TestDrive, you can take lessons from the 4 teachers who look like the best fit for you - - for just $49.99. Or if you see a specific teacher who you just know is right for you, you can sign up - for lessons directly with that instructor through JamClass, and skip the TestDrive program.

      -

      If you want to check out teachers before signing up, use the link below to search our community of teachers. If you are looking for someone/something specific that you can't find in our set of instructors, please let us - know and we'll go add the right teachers to meet your needs. We are constantly reviewing prospective teachers + know and our lesson concierge staff will find and add the right teachers. We are constantly reviewing prospective teachers and adding to the community, and we don't mind at all using specific student requests to focus our efforts on filling holes in our coverage.

      +
      - Search JamClass Instructors + Search JamClass Instructors
      Please note that clicking this link will open a new tab in your browser.
      When you're done searching, just close that tab, and you'll return here. @@ -394,4 +415,5 @@ rest = context.JK.Rest() {what_now}
      ` + }) \ No newline at end of file diff --git a/web/app/assets/javascripts/react-components/landing/JamClassStudentLandingPage.js.jsx.coffee b/web/app/assets/javascripts/react-components/landing/JamClassStudentLandingPage.js.jsx.coffee index 3eaf9af5e..addb00d93 100644 --- a/web/app/assets/javascripts/react-components/landing/JamClassStudentLandingPage.js.jsx.coffee +++ b/web/app/assets/javascripts/react-components/landing/JamClassStudentLandingPage.js.jsx.coffee @@ -4,8 +4,6 @@ rest = context.JK.Rest() @JamClassStudentLandingPage = React.createClass({ render: () -> - - loggedIn = context.JK.currentUserId? if this.state.done @@ -19,26 +17,33 @@ rest = context.JK.Rest() ctaButtonText = 'SIGN UP' if loggedIn - register = `` + register = `` else - if this.state.loginErrors? for key, value of this.state.loginErrors break - errorText = context.JK.getFullFirstError(key, this.state.loginErrors, {email: 'Email', password: 'Password', 'terms_of_service' : 'The terms of service'}) + errorText = context.JK.getFullFirstError(key, this.state.loginErrors, + {email: 'Email', password: 'Password', 'terms_of_service': 'The terms of service'}) register = `
      {errorText}
      - - + + +
      -
      +
      + +
      - +
      ` @@ -46,36 +51,61 @@ rest = context.JK.Rest() `
      - teacher instructing a jam class -

      JAMCLASS

      -

      Finally, online music lessons
      that really work!

      +

      Let Us Find You The Perfect Music Teacher

      + +

      And Connect You Online With Our Patented, Unique Technology

      + + +
      - -
      - +
      +
      as seen on
      + +
      + + +
      + +
      Sign Up for TestDrive
      -

      Sign up now and take lessons from 4 different instructors for just $49.99.
      Then pick the one that's best for you.

      -

      Connecting with the right teacher is the most important factor in making your lessons successful, and we make it inexpensive and painless.

      -

      Sign up now for our special TestDrive offer. We will not share your email. See our privacy policy

      +

      Sign up now. You have no obligation to buy anything. Signing up makes you eligible for our TestDrive + offers.

      + +

      After signing up, you can search our community of world-class instructors. If you book a TestDrive lesson + you can choose to TestDrive 4, 2, or 1 teachers at that time.

      + +

      We will not share your email. See our privacy + policy

      {register} -

      And pick your 4 teachers now!

      +

      And pick your teachers now!

      +

      We'll give you 1:1 help to get set up and ready to go with our free app.

      - JamClass by JamKazam is by far the best way to take online music lessons. Using our unique, patented technologies, you can play live in sync with your teacher over the Internet with incredible audio quality. Find and connect with the best teacher (not the closest) painlessly using our TestDrive program. Refer back to recorded demonstrations and concepts between lessons. Apply what you're learning to play along with a virtual band on your favorite songs. All while avoiding the time and cost of travel to and from lessons. +

      The Future of Music Education Is Here

      +
        +
      • Connect with the best teacher for you, not the closest
      • +
      • TestDrive multiple teachers to find your ideal match
      • +
      • Enjoy studio quality audio in online sessions
      • +
      • Play music with your teacher live and in sync
      • +
      • Avoid the time and hassle of travel to and from lessons
      • +
      • Record lessons to refer back to them anytime
      • +
      • Use JamTracks to learn and play with your favorite music
      • +
      • Practice what you've learned in online sessions with others
      • +

      ` getInitialState: () -> - {loginErrors: null, processing:false} + {loginErrors: null, processing: false} privacyPolicy: (e) -> e.preventDefault() @@ -87,12 +117,12 @@ rest = context.JK.Rest() context.JK.popExternalLink('/corp/terms') - componentDidMount:() -> + componentDidMount: () -> $root = $(this.getDOMNode()) $checkbox = $root.find('.terms-checkbox') context.JK.checkbox($checkbox) - # add item to cart, create the user if necessary, and then place the order to get the free JamTrack. +# add item to cart, create the user if necessary, and then place the order to get the free JamTrack. ctaClick: (e) -> e.preventDefault() @@ -107,18 +137,18 @@ rest = context.JK.Rest() else @createUser() - @setState({processing:true}) + @setState({processing: true}) markStudent: () -> - rest.updateUser({student: true}) - .done((response) => - this.setState({done: true}) - context.location = '/client#/profile/' + context.JK.currentUserId - ) - .fail((jqXHR) => - this.setState({processing: false}) - context.JK.app.notifyServerError(jqXHR, "Unable to Mark As Student") - ) + rest.updateUser({student: true}) + .done((response) => + this.setState({done: true}) + context.location = '/client#/profile/' + context.JK.currentUserId + ) + .fail((jqXHR) => + this.setState({processing: false}) + context.JK.app.notifyServerError(jqXHR, "Unable to Mark As Student") + ) createUser: () -> $form = $('.jamtrack-signup-form') @@ -126,12 +156,12 @@ rest = context.JK.Rest() password = $form.find('input[name="password"]').val() terms = $form.find('input[name="terms"]').is(':checked') - rest.signup({email: email, password: password, first_name: null, last_name: null, terms:terms, student : true}) + rest.signup({email: email, password: password, first_name: null, last_name: null, terms: terms, student: true}) .done((response) => @setState({done: true}) context.location = '/client#/profile/' + response.id ).fail((jqXHR) => - @setState({processing:false}) + @setState({processing: false}) if jqXHR.status == 422 response = JSON.parse(jqXHR.responseText) if response.errors @@ -143,5 +173,5 @@ rest = context.JK.Rest() ) - @setState({processing:true}) + @setState({processing: true}) }) \ No newline at end of file diff --git a/web/app/assets/javascripts/react-components/landing/JamClassTeacherLandingBottomPage.js.jsx.coffee b/web/app/assets/javascripts/react-components/landing/JamClassTeacherLandingBottomPage.js.jsx.coffee index 6a29bb216..b9efbc93e 100644 --- a/web/app/assets/javascripts/react-components/landing/JamClassTeacherLandingBottomPage.js.jsx.coffee +++ b/web/app/assets/javascripts/react-components/landing/JamClassTeacherLandingBottomPage.js.jsx.coffee @@ -249,13 +249,13 @@ rest = context.JK.Rest()

      What Do You Need to Play in JamClass Lessons?

      - At a mininum, you need:

      + At a minimum, you need:

      • A computer running either
          -
        • Windows 7 or a later version (32-bit or 64-bit) +
        • Windows 7 or a later version
        • -
        • Mac OS X 10.7 or a later version (64-bit)
          +
        • Mac OS X 10.7 or a later version
          how do I know which version I'm running and if it's 64-bit on Mac?
        • @@ -269,13 +269,12 @@ rest = context.JK.Rest()

          To have very high quality audio in your sessions, rather than using the built-in microphone on your computer - to capture your instrumental and/or vocal audio, we strongly recommend using an external audio interface. An + to capture your instrumental and/or vocal audio, we recommend using an external audio interface. An audio interface is a hardware product that connects to your computer and processes audio better than your computer alone. If you already own/use an audio interface, you can use the one you have. And if you don't, - please read this help article on audio interfaces that can guide you to get what you - need. You can pick up a perfectly good interface very inexpensively, typically for less than $50. And you can - use your new interface not just for JamClass, but also to make home recordings of your performances, etc. So + please refer to this set of help articles that recommend the best gear based on your instruments and/or vocals. You can pick up a perfectly good interface very inexpensively, typically for less than $50. And you can + use your new interface not just for JamClass, but also to make home recordings of your performances, and also to play in online JamKazam sessions with other musicians. So it's a great thing to have for any musician.

          diff --git a/web/app/assets/stylesheets/landings/individual_jamtrack.css.scss b/web/app/assets/stylesheets/landings/individual_jamtrack.css.scss index c4f719ef2..0c21fb02a 100644 --- a/web/app/assets/stylesheets/landings/individual_jamtrack.css.scss +++ b/web/app/assets/stylesheets/landings/individual_jamtrack.css.scss @@ -31,6 +31,27 @@ body.web.individual_jamtrack { $cta-color: #e03d04; $chunkyBorderWidth: 6px; + [data-react-class="JamClassStudentLandingPage"] { + h2.future-header { + color:white; + margin-bottom:20px; + } + ol, ul, li { + font-size:16px; + line-height:75%; + color: $copy-color-on-dark; + } + ol { + list-style-type: decimal; + } + ul { + list-style-type: disc; + } + li { + margin-left:20px; + margin-bottom: 10px; + } + } .logo-home { @include layout-small { margin-left:20px !important; @@ -62,6 +83,10 @@ body.web.individual_jamtrack { top: -150px; right: 107px; background-color:black; + + &.student { + top:-13px; + } } .name-and-artist { padding-top: 60px; @@ -355,6 +380,27 @@ body.web.individual_jamtrack { @include layout-small { text-align:center; } + + ol, ul, li { + font-size:16px; + line-height:100%; + color: $copy-color-on-dark; + } + ol { + list-style-type: decimal; + } + p.bump { + margin-bottom:20px; + } + ul { + margin:20px 0; + list-style-type: disc; + } + li { + margin-left:20px; + margin-bottom: 10px; + } + } .white-bar { @@ -497,7 +543,8 @@ body.web.individual_jamtrack { .arrow1-jamclass { position: absolute; left: -256px; - top: -61px; + top: 286px; + width: 225px; } .testimonials { @@ -613,6 +660,39 @@ body.web.individual_jamtrack { } } + .jamclass-h1 { + font-size: 30px !important; + padding-top: 0; + } + + .jamclass-h2 { + margin:10px 0 20px; + color: #8d8d8d; + font-size: 20px; + } + + .app-screenshot { + + } + + .video-screenshot { + position: absolute; + left: 281px; + top: 320px; + } + + .logo-composite { + background-color: black; + position: absolute; + right: 61px; + width: 320px; + top: 37px; + @include border_box_sizing; + } + .logo-composite-header { + text-align:center; + color:$ColorTextTypical; + } .preview-and-action-box { background-color: black; position: absolute; @@ -634,6 +714,10 @@ body.web.individual_jamtrack { &.jamclass { top:209px; + + &.student { + top:541px; + } } .preview-jamtrack-header { diff --git a/web/app/views/landings/jam_class_students.html.slim b/web/app/views/landings/jam_class_students.html.slim index 9d9771dcc..33aaf6537 100644 --- a/web/app/views/landings/jam_class_students.html.slim +++ b/web/app/views/landings/jam_class_students.html.slim @@ -10,8 +10,18 @@ h2 SIGN UP FOR YOUR FREE LESSON NOW! - else h2 SIGN UP FOR TESTDRIVE NOW! - p And join 30,000+ other musicians in the JamKazam community. - p.cta-text Not sure if JamClass is for you? Scroll down to learn more. + p + | The single most important factor in the success of your music lessons is your teacher. + | You wouldn't marry the first person you date, right? + br + | Our TestDrive program lets you: + ul + li Take a full lesson from 4 different teachers for just $49.99 each, or + li Take a full lesson from 2 different teachers for just $29.99 each, or + li Take a full lesson from 1 teacher for just $14.99 + p.bump Then continue your lessons with the best teacher for you! + p.bump Join 40,000+ other musicians in the JamKazam community. Sign up for TestDrive today, and you'll be eligible for any of the three special offers above! + p.cta-text Not sure if this is for you? Scroll down to learn more... - content_for :white_bar do = react_component 'JamClassStudentLandingBottomPage', @page_data.to_json