responsive redesign: a beta approach
TRANSCRIPT
RWDA Beta Approach
Sarah Johnson LiRollins College@pixelsbysarah
Not to be confused
with…
Rollins College
Rollins.edu/beta
What we did
What we learned
What we could have done differently
Identify What’s
ImportantTask Force Design/Dev
Cycle
FeedbackPhase 2
Launch & Transition
Continuing Work
Identify What’s
ImportantTask Force Design/Dev
Cycle
FeedbackPhase 2
Launch & Transition
Continuing Work
Why We Chose RWD
Mobile visits increased dramaticallySame content, same location
Easy updates, less workAdapts to the environment
Promotes simple, effective content
Audience is most ImportantWhat they said• Hard to navigate
• Cluttered
• Old looking
What they did• Common search terms
• Top pages from Google Analytics
• Event Tracking
Why?
Identify What’s
ImportantTask Force Design/Dev
Cycle
FeedbackPhase 2
Launch & Transition
Continuing Work
Don’t call it aCommittee,
call it aTask Force
Our Task Force13 Academic & Administrative
Departments
Student Representatives
Invited more people for feedback
Create ambassadors
Task Force ItineraryDialogue, not monologues
Understanding value of Responsive Design
Reviewed our analytics and peer websites
Showed designs late
Oops!
External transparency (blog)
Identify What’s
ImportantTask Force Design/Dev
Cycle
FeedbackPhase 2
Launch & Transition
Continuing Work
First Things First…
Change of mindsetEveryone learned and contributed
Mobile First comfortablyStarted coding right away
Design
“Live” Mockups
Review
Identify Problems
Design/Dev Tricks
Get over learning curves earlyEmphasize Web != Print
Don’t sweat the small stuffKeep it Simple
Communicate & CompromiseShut the Front Door!
Dev TricksBrowserstack.com
CSS3 Mediaqueries http://goo.gl/DbcFU6
Caniuse.com
CSS3files.com
http://www.feuersonne.com/Nobodyperfect.html
Play, break stuff,
experiment.If you see something
that could be done better, do it
@rem / Remy Sharp
Framework?
ZingDesignDecision Flowchart & Advice
http://goo.gl/h0UDB8
Google and the rest of the world is not going to give your site better ranking or points by using a certain
framework
Jeffrey Li
Oops!
Set Feature PrioritiesDoes this prevent us from launching?
Ideal sitemapDesign Mobile Up
Team in two different buildings
Identify What’s
ImportantTask Force Design/Dev
Cycle
FeedbackPhase 2
Launch & Transition
Continuing Work
wow! as a prospective student, the new website is awesome.
Gorgeous!
The font choices and colors are young and childish.
Fresh and bold look
Doesn't show the sophistication or breath of Rollins
it's MUCH more pleasant to the eye.
high school website
the layout has everything one would need to find out more information
I would like to go back to the background that displays the architecture of the campus
NO.THIS SUCKS. I love
our website as is.Much better than the dull look we currently have.
You won’t please everyone
In general, people hate changeAddress squeaky wheels
Back up your decisionsChange or adapt…within reason
Oops!
Be transparent about brand changes to eliminate confusion
Identify What’s
ImportantTask Force Design/Dev
Cycle
FeedbackPhase 2
Launch & Transition
Continuing Work
Don’t say we didn’t warn you
Sunset Schedule for “Parchment”Push visitors to “Beta”Add finishing touches
Fix imperfections
Oops!
Spent too long collecting feedbackProduction schedule pushed back
Set feature priorities
Identify What’s
ImportantTask Force Design/Dev
Cycle
FeedbackPhase 2
Launch & Transition
Continuing Work
Do Not Set it and forget it
We are never done…and neither are you
Continuous Work
Changes in Culture, GenerationsAdvances in TechnologyEvolving Web StandardsNew Ideas & Solutions
In Conclusion…
Takeaways
Your audience is most importantKeep audience informed & involvedTeam chemistry & communication
Can’t please everyoneMultiple solutions available
Never stop improving!
