VRFS-4108 - student landing page updates
This commit is contained in:
parent
3deaa205d5
commit
2ba3655191
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
|
|
@ -4,8 +4,17 @@ context = window
|
|||
{
|
||||
displayName: 'JamClassPhone',
|
||||
|
||||
getInitialProps: () ->
|
||||
{
|
||||
customClass: null
|
||||
}
|
||||
render: ->
|
||||
`<div className="jamclass-phone">
|
||||
classes = {"jamclass-phone": true}
|
||||
|
||||
if @props.customClass?
|
||||
classes[@props.customClass] = true
|
||||
|
||||
`<div className={classNames(classes)}>
|
||||
<img src="/assets/content/phone-icon.png" width="32" height="32"/>
|
||||
|
||||
<div className="callwrapper">
|
||||
|
|
|
|||
|
|
@ -325,13 +325,13 @@ rest = context.JK.Rest()
|
|||
<h2 className="awesome">What Does Your School Need to Host JamClass Lessons?</h2>
|
||||
|
||||
<p>
|
||||
At a mininum, you need:</p>
|
||||
At a minimum, you need:</p>
|
||||
<ul>
|
||||
<li>A computer running either
|
||||
<ul>
|
||||
<li>Windows 7 or a later version (32-bit or 64-bit)
|
||||
<li>Windows 7 or a later version
|
||||
</li>
|
||||
<li>Mac OS X 10.7 or a later version (64-bit)<br/>
|
||||
<li>Mac OS X 10.7 or a later version<br/>
|
||||
<a className="how-do-i" href="https://support.apple.com/en-us/HT201948" target="_blank">how do I know
|
||||
which version I'm running and if it's 64-bit on Mac?</a>
|
||||
</li>
|
||||
|
|
@ -345,13 +345,12 @@ rest = context.JK.Rest()
|
|||
|
||||
<p>
|
||||
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 <a href="https://jamkazam.desk.com/customer/portal/articles/1292412-choosing-an-audio-device"
|
||||
target="_blank">read this help article on audio interfaces</a> 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 <a href="https://jamkazam.desk.com/customer/en/portal/topics/564807-gear-recommendations/articles"
|
||||
target="_blank">refer to this set of help articles that recommend the best gear based on your instruments and/or vocals</a>. 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.
|
||||
</p>
|
||||
|
||||
|
|
|
|||
|
|
@ -11,13 +11,21 @@ rest = context.JK.Rest()
|
|||
`<div id="what-now" className="row awesome jam-class">
|
||||
<h2 className="awesome">What Now?</h2>
|
||||
|
||||
<p>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:</p>
|
||||
<p>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:</p>
|
||||
<ol>
|
||||
<li>Search for the instructor who looks best for you, and book your lesson with him or her.</li>
|
||||
<li>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.</li>
|
||||
<li>Enter your credit card information. You will <b>not</b> 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.</li>
|
||||
<li>Search for the instructor(s) who look best for you, and book your lesson with him or her.</li>
|
||||
<li>Enter your credit card information. You will <b>not</b> 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.
|
||||
</li>
|
||||
<li>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.
|
||||
</li>
|
||||
</ol>
|
||||
<p>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 <a href="" target="_blank" onClick={alert.bind('not yet')}>JamClass User Guide</a>.</p>
|
||||
<p>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 <a href="https://jamkazam.desk.com/customer/en/portal/topics/926073-jamclass-online-music-lessons---for-students/articles" target="_blank">JamClass
|
||||
User Guide</a>.</p>
|
||||
</div>`
|
||||
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 =
|
||||
`<div id="what-now" className="row awesome jam-class">
|
||||
<h2 className="awesome">What Now?</h2>
|
||||
<h2 className="awesome">What Now?</h2>
|
||||
|
||||
<p>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:</p>
|
||||
<ol>
|
||||
<li>Search for the 4 instructors who look best for you, and sign up for a TestDrive lesson with each of them.</li>
|
||||
<li>Work with a JamKazam staff person, who will give you all the 1:1 help you need to get set up for online lessons.</li>
|
||||
<li>Plug in your credit card info to pay for your TestDrive</li>
|
||||
</ol>
|
||||
<p>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 <a href="" target="_blank" onClick={alert.bind('not yet')}>JamClass User Guide</a>.</p>
|
||||
</div>`
|
||||
<p>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:</p>
|
||||
<ol>
|
||||
<li>Search for the 4 instructors who look best for you, and sign up for a TestDrive lesson with each of
|
||||
them.
|
||||
</li>
|
||||
<li>Work with a JamKazam staff person, who will give you all the 1:1 help you need to get set up for online
|
||||
lessons.
|
||||
</li>
|
||||
<li>Plug in your credit card info to pay for your TestDrive</li>
|
||||
</ol>
|
||||
<p>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 <a href="" target="_blank"
|
||||
onClick={alert.bind('not yet')}>JamClass
|
||||
User Guide</a>.</p>
|
||||
</div>`
|
||||
`<div className="top-container">
|
||||
<div className="row awesome jam-class">
|
||||
<h2 className="awesome">What Makes JamClass Awesome?</h2>
|
||||
<h2 className="awesome">What Makes JamClass Lessons Awesome?</h2>
|
||||
|
||||
<p>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.</p>
|
||||
|
||||
|
|
@ -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.</p>
|
||||
|
|
@ -65,40 +81,49 @@ rest = context.JK.Rest()
|
|||
<h3>JamClass Kudos</h3>
|
||||
|
||||
<div className="testimonial">
|
||||
<img src="/assets/landing/Julie Bonk - Jam Class - Speech Bubble.png" className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Julie Bonk - Jam Class - Speech Bubble.png"
|
||||
className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Julie Bonk - Avatar.png" className="testimonial-avatar"/>
|
||||
<h4><strong>Julie Bonk</strong></h4>
|
||||
|
||||
<div className="testiminal-background">
|
||||
Oft-recorded pianist, teacher, mentor to Grammy winner Norah Jones and Scott Hoying of Pentatonix
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonial">
|
||||
<img src="/assets/landing/Carl Brown - Jam Class - Speech Bubble.png" className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Carl Brown - Jam Class - Speech Bubble.png"
|
||||
className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Carl Brown - Avatar.png" className="testimonial-avatar"/>
|
||||
<a rel="external" href="https://www.youtube.com/channel/UCvnfBBzEizi1T5unOXNCxdQ"><img
|
||||
src="/assets/landing/Carl Brown - YouTube.png" className="testimonial-youtube"/></a>
|
||||
<h4><strong>Carl Brown</strong> of GuitarLessions365</h4>
|
||||
</div>
|
||||
<div className="testimonial">
|
||||
<img src="/assets/landing/Justin Pierce - Jam Class - Speech Bubble.png" className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Justin Pierce - Jam Class - Speech Bubble.png"
|
||||
className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Justin Pierce - Avatar.png" className="testimonial-avatar"/>
|
||||
<h4><strong>Justin Pierce</strong></h4>
|
||||
|
||||
<div className="testiminal-background">
|
||||
Masters degree in jazz studies, performer in multiple bands, saxophone instructor
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonial">
|
||||
<img src="/assets/landing/Dave Sebree - Jam Class - Speech Bubble.png" className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Dave Sebree - Jam Class - Speech Bubble.png"
|
||||
className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Dave Sebree - Avatar.png" className="testimonial-avatar"/>
|
||||
<h4><strong>Dave Sebree</strong></h4>
|
||||
|
||||
<div className="testiminal-background">
|
||||
Founder of Austin School of Music, Gibson-endorsed guitarist, touring musician
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonial">
|
||||
<img src="/assets/landing/Sara Nelson - Jam Class - Speech Bubble.png" className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Sara Nelson - Jam Class - Speech Bubble.png"
|
||||
className="testimonial-speech-bubble"/>
|
||||
<img src="/assets/landing/Sara Nelson - Avatar.png" className="testimonial-avatar"/>
|
||||
<h4><strong>Sara Nelson</strong></h4>
|
||||
|
||||
<div className="testiminal-background">
|
||||
Cellist for Austin Lyric Opera, frequently recorded with major artists
|
||||
</div>
|
||||
|
|
@ -183,13 +208,15 @@ rest = context.JK.Rest()
|
|||
<img className="teacher-icon bottom-right" src="/assets/landing/teacher-icon-small.png"/>
|
||||
<br className="clearall"/>
|
||||
</div>
|
||||
<div className="testdrive-note">Lessons with 4 instructors for just $49.99. A phenomenal value. You
|
||||
wouldn't marry the first person you ever date, right?
|
||||
<div className="testdrive-note">Try more than one instructor. You wouldn’t marry the first person you date, right?
|
||||
</div>
|
||||
</div>
|
||||
<p>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}</p>
|
||||
<p>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.</p>
|
||||
|
||||
<div className="clearall"/>
|
||||
</p>
|
||||
|
|
@ -286,7 +313,7 @@ rest = context.JK.Rest()
|
|||
<div className="awesome-item">
|
||||
<h3>
|
||||
<div className="awesome-number">8</div>
|
||||
And So Much More...
|
||||
And More…
|
||||
</h3>
|
||||
<p>
|
||||
<p>There are many other features that are specifically useful for online lessons built into JamClass by
|
||||
|
|
@ -310,13 +337,13 @@ rest = context.JK.Rest()
|
|||
<h2 className="awesome">What Do You Need to Play in JamClass Lessons?</h2>
|
||||
|
||||
<p>
|
||||
At a mininum, you need:</p>
|
||||
At a minimum, you need:</p>
|
||||
<ul>
|
||||
<li>A computer running either
|
||||
<ul>
|
||||
<li>Windows 7 or a later version (32-bit or 64-bit)
|
||||
<li>Windows 7 or a later version
|
||||
</li>
|
||||
<li>Mac OS X 10.7 or a later version (64-bit)<br/>
|
||||
<li>Mac OS X 10.7 or a later version<br/>
|
||||
<a className="how-do-i" href="https://support.apple.com/en-us/HT201948" target="_blank">how do I know
|
||||
which version I'm running and if it's 64-bit on Mac?</a>
|
||||
</li>
|
||||
|
|
@ -330,16 +357,14 @@ rest = context.JK.Rest()
|
|||
|
||||
<p>
|
||||
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 <a href="https://jamkazam.desk.com/customer/portal/articles/1292412-choosing-an-audio-device"
|
||||
target="_blank">read this help article on audio interfaces</a> 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 <a href="https://jamkazam.desk.com/customer/en/portal/topics/564807-gear-recommendations/articles"
|
||||
target="_blank">refer to this set of help articles that recommend the best gear based on your instruments and/or vocals</a>. 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.
|
||||
</p>
|
||||
|
||||
<p>
|
||||
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()
|
|||
<div className="row awesome jam-class">
|
||||
<h2 className="awesome">We Have Fabulous Teachers, Check Them Out!</h2>
|
||||
|
||||
<p>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
|
||||
<p>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.</p>
|
||||
|
||||
<p>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 <b>know</b> is right for you, you can sign up
|
||||
for lessons directly with that instructor through JamClass, and skip the TestDrive program.</p>
|
||||
|
||||
<p>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.</p>
|
||||
|
||||
<div className="search-area">
|
||||
<a onClick={alert.bind("not yet!")} target="_blank">Search JamClass Instructors</a>
|
||||
<a href="/client#/jamclass/searchOptions" target="_blank">Search JamClass Instructors</a>
|
||||
|
||||
<div className="tab-and-return">Please note that clicking this link will open a new tab in your browser.<br/>
|
||||
When you're done searching, just close that tab, and you'll return here.
|
||||
|
|
@ -394,4 +415,5 @@ rest = context.JK.Rest()
|
|||
|
||||
{what_now}
|
||||
</div>`
|
||||
|
||||
})
|
||||
|
|
@ -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 = `<button className={classNames({'cta-button' : true, 'processing': this.state.processing})} onClick={this.ctaClick}>{ctaButtonText}</button>`
|
||||
register = `<button className={classNames({'cta-button' : true, 'processing': this.state.processing})}
|
||||
onClick={this.ctaClick}>{ctaButtonText}</button>`
|
||||
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 = `<div className="register-area jam-class">
|
||||
<div className={classNames({'errors': true, 'active': this.state.loginErrors})}>
|
||||
{errorText}
|
||||
</div>
|
||||
<form className="jamtrack-signup-form">
|
||||
<label>Email: </label><input type="text" name="email" />
|
||||
<label>Password: </label><input type="password" name="password" />
|
||||
<label>Email: </label><input type="text" name="email"/>
|
||||
<label>Password: </label><input type="password" name="password"/>
|
||||
|
||||
<div className="clearall"/>
|
||||
<div className="checkbox-wrap"><input className="terms-checkbox" type="checkbox" name="terms" /></div><label className="terms-help">I have read and agree to the JamKazam <a href="/corp/terms" onClick={this.termsClicked}>terms of service</a></label>
|
||||
<div className="checkbox-wrap"><input className="terms-checkbox" type="checkbox" name="terms"/></div>
|
||||
<label className="terms-help">I have read and agree to the JamKazam <a href="/corp/terms"
|
||||
onClick={this.termsClicked}>terms of
|
||||
service</a></label>
|
||||
|
||||
<div className="clearall"/>
|
||||
<button className={classNames({'cta-button' : true, 'processing': this.state.processing})} onClick={this.ctaClick}>{ctaButtonText}</button>
|
||||
<button className={classNames({'cta-button' : true, 'processing': this.state.processing})}
|
||||
onClick={this.ctaClick}>{ctaButtonText}</button>
|
||||
</form>
|
||||
</div>`
|
||||
|
||||
|
|
@ -46,36 +51,61 @@ rest = context.JK.Rest()
|
|||
`<div className="top-container">
|
||||
<div className="full-row name-and-artist">
|
||||
<div>
|
||||
<img className="jam-class-teacher" width="375" height="215" src="/assets/landing/jam_class.png" alt="teacher instructing a jam class"/>
|
||||
<h1 className="jam-track-name">JAMCLASS</h1>
|
||||
<h2 className="original-artist">Finally, online music lessons<br/>that really work!</h2>
|
||||
<h1 className="jamclass-h1">Let Us Find You The Perfect Music Teacher</h1>
|
||||
|
||||
<h2 className="jamclass-h2">And Connect You Online With Our Patented, Unique Technology</h2>
|
||||
<img className="app-screenshot" src="" height="344" width="608"/>
|
||||
<img className="video-screenshot" src="" height="192" width="312"/>
|
||||
|
||||
<div className="clearall"/>
|
||||
</div>
|
||||
<JamClassPhone/>
|
||||
<div className="preview-and-action-box jamclass">
|
||||
<img src="/assets/landing/arrow-1-student.png" className="arrow1-jamclass" />
|
||||
<div className="logo-composite">
|
||||
<div className="logo-composite-header">as seen on</div>
|
||||
<img src="/assets/landing/logo-composite.png" height="349" width="320"/>
|
||||
</div>
|
||||
<JamClassPhone customClass="student"/>
|
||||
|
||||
<div className="preview-and-action-box jamclass student">
|
||||
<img src="/assets/landing/student_landing_cta_arrow.png" className="arrow1-jamclass"/>
|
||||
|
||||
<div className="preview-jamtrack-header">
|
||||
Sign Up for TestDrive
|
||||
</div>
|
||||
<div className={classNames({'preview-area': true, 'jam-class': true})}>
|
||||
<p>Sign up now and take lessons from 4 different instructors for just $49.99.<br/>Then pick the one that's best for you.</p>
|
||||
<p>Connecting with the right teacher is the most important factor in making your lessons successful, and we make it inexpensive and painless.</p>
|
||||
<p>Sign up now for our special TestDrive offer. We will not share your email. See our <a href="/corp/privacy" onClick={this.privacyPolicy}>privacy policy</a></p>
|
||||
<p>Sign up now. You have no obligation to buy anything. Signing up makes you eligible for our TestDrive
|
||||
offers.</p>
|
||||
|
||||
<p>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.</p>
|
||||
|
||||
<p>We will not share your email. See our <a href="/corp/privacy" onClick={this.privacyPolicy}>privacy
|
||||
policy</a></p>
|
||||
{register}
|
||||
<p>And pick your 4 teachers now!</p>
|
||||
<p>And pick your teachers now!</p>
|
||||
|
||||
<p>We'll give you 1:1 help to get set up and ready to go with our free app.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row summary-text">
|
||||
<p className="top-summary">
|
||||
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.
|
||||
<h2 className="future-header">The Future of Music Education Is Here</h2>
|
||||
<ul className="future-list">
|
||||
<li>Connect with the best teacher for you, not the closest</li>
|
||||
<li>TestDrive multiple teachers to find your ideal match</li>
|
||||
<li>Enjoy studio quality audio in online sessions</li>
|
||||
<li>Play music with your teacher live and in sync</li>
|
||||
<li>Avoid the time and hassle of travel to and from lessons</li>
|
||||
<li>Record lessons to refer back to them anytime</li>
|
||||
<li>Use JamTracks to learn and play with your favorite music</li>
|
||||
<li>Practice what you've learned in online sessions with others</li>
|
||||
</ul>
|
||||
</p>
|
||||
</div>
|
||||
</div>`
|
||||
|
||||
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})
|
||||
})
|
||||
|
|
@ -249,13 +249,13 @@ rest = context.JK.Rest()
|
|||
<h2 className="awesome">What Do You Need to Play in JamClass Lessons?</h2>
|
||||
|
||||
<p>
|
||||
At a mininum, you need:</p>
|
||||
At a minimum, you need:</p>
|
||||
<ul>
|
||||
<li>A computer running either
|
||||
<ul>
|
||||
<li>Windows 7 or a later version (32-bit or 64-bit)
|
||||
<li>Windows 7 or a later version
|
||||
</li>
|
||||
<li>Mac OS X 10.7 or a later version (64-bit)<br/>
|
||||
<li>Mac OS X 10.7 or a later version<br/>
|
||||
<a className="how-do-i" href="https://support.apple.com/en-us/HT201948" target="_blank">how do I know
|
||||
which version I'm running and if it's 64-bit on Mac?</a>
|
||||
</li>
|
||||
|
|
@ -269,13 +269,12 @@ rest = context.JK.Rest()
|
|||
|
||||
<p>
|
||||
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 <a href="https://jamkazam.desk.com/customer/portal/articles/1292412-choosing-an-audio-device"
|
||||
target="_blank">read this help article on audio interfaces</a> 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 <a href="https://jamkazam.desk.com/customer/en/portal/topics/564807-gear-recommendations/articles"
|
||||
target="_blank">refer to this set of help articles that recommend the best gear based on your instruments and/or vocals</a>. 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.
|
||||
</p>
|
||||
|
||||
|
|
|
|||
|
|
@ -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 {
|
||||
|
|
|
|||
|
|
@ -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
|
||||
|
|
|
|||
Loading…
Reference in New Issue