Jackson Creek Middle School (JCMS) Science Website is a one-stop portal for the 7th and 8th grade Science class students to find their homework, labs, class agendas and test dates, e-book chapters, view syllabus and class policies, as well as access any class-related or other external resources and activities provided by the teacher. The website was made using 'Google Sites' and is curated and maintained by the teacher.
Problem space and definition
What is the problem
Website contains wealth of valuable content but lacks a clear organization, is not simple to navigate, and has no easy way to discover the material. Consequently, the website is rarely used by students and parents . While it was created to help the students, it soon lost much of its value. The teacher is aware of the problem due to on-going feedback; however, she is not technically-savvy enough to remedy this situation alone and needs external help.
Why improvement is needed
- Re-design the site to make it into an intuitive, functional and aesthetically pleasing product.
- Make things easily discoverable and accessible.
- Provide for an easy maintenance and curation of the content by the teacher.
- The change should bring back and re-engage the students to add more value to their study of the subject.
How the problem was discovered and identified
At the very beginning of 2017 school year, I was helping my 7th-grader son find the necessary class homework on the website and found it has lots of valuable information but lacks organization and has a a confusing navigation. The teacher's intent seemed great but suffered in execution.
I saw this as a design challenge and as an opportunity to improve the existing product and felt empathetic to both the users' and teacher's needs and felt compelled to help to make a positive impact.
Once I approached the teacher, my proposal was met with an enthusiastic approval .
Roles and Responsibilities
This side project was initiated and entirely done by myself, including but not limited to:
Idea generation, research / interviews, design, prototyping and any necessary Java Script programming to support the prototype testing.
The goal for this and other side projects was to seek out design opportunities and do it all by myself to gain the necessary overall experience from having an idea all the way to the implementation and refinement.
The research yielded important insights. However, it is very important to let our personas' "voices" be heard and understood to meet their needs.
- Don’t make me think hard to find the information that I need
- I don’t like reading much to get to places I want. I need to be given easy choices
- I am good with excuses! If I don’t quickly find the info I need on that site, I conclude it does not exist
- If there is any urgent announcement, I want to see it right away
- I have a busy schedule. I don’t want to spend much time muddling through the website while helping my child
- I may or may not be technically-savvy to figure things out if it is not very clearly available
- I need to quickly be aware of and verify things like test dates, homework due dates and other urgent announcements
- I want to retain one primary go-to place for the class-related material regardless of which content provider our school adopts next
- Students of different ability levels must be equally comfortable using the site
- I want fewer but clear choices that should then lead to deeper and related information
- Encourage to discover content, make students feel empowered while using the site
As insights started to paint a "big picture", important question remained - how do I find a right balance in the concept?
- Different students have different needs and goals. How does one person find vocabulary section as easy as another one finds homework labs?
- Overall standardization and simplification is good. Yet, how do we integrate the established specific "teaching model" of how this teacher assigns and manages homework and materials?
Thus, trade-offs had to be made… But which ones?
My design's challenges
Finding a sweet spot to arrive at the optimal experience for allClick the image to enlarge
Insights' analysis led to establishing the following objectives to create an improved product:
- Simplify the site’s navigation and organization by using similar elements
- Make the site responsive to different resolutions
- Greatly minimize the cognitive load of the home page
- Give the user the right number of right choices at the right time
- Make user feel in control
- The content should be easily discoverable
Brainstorming and Sketching
These are a few examples outlining my initial thinking and the vision
I used Balsamiq to create deliverables for the meetings and also for electronic communications with the client. See excerpts from the final wireframe journey and came as a result of continuous iterations based on the client's feedback.
Get to places quickly. Find what you need.
No more jumping pages. All is in one place.
Client's praise of the output
That was when I knew I am making a difference and not just redesigning a website.
Concept in action
See a quick video presentation of how the concept works
Click on the picture to to go Sketch Cloud to interact with a prototype:
As of end of May 2018, the usability testing of the prototype is currently in progress. Results will be published shortly!.
Outcomes and Lessons
Navigation, Organization, Simplification, Usability
- Organization of the content was greatly improved. Hierarchy of the content has been established
- Discovery of new content by a novice user became easier
- The concept retained the main character and specific "teaching model" present in the original site: goal-oriented and need-oriented narrative.
- Implementation is planned to be a responsive website
- Navigational footprint was reduced dramatically. Out of 15 pages we have 7!
Reducing complexity and redundancy. Two clicks to get to all of the homework materials!
Proposed implementation schedule
Upon a successful usability test of the prototype, the next steps are:
Strategy and vision
Granted a successful implementation and a positive feedback, the concept is envisioned to expand and emerge as a viable and sustainable system which could be adopted for each of the teacher.
What I have learned
- The quality of survey’s answers is only as good as the quality of the questions posed.
- Learn users' professional vocabulary. Don’t just listen to what and how they say but also decipher what they mean.
- It is crucial to capture a clear picture during the initial interviews. Missing important details upfront prolongs the process and affects the final result
- Users may not always see the existing product's faults since they have used it for a time. The job of the designer is to point out the faults and help them see the benefits of the change.
- In survey results, statistical majority doesn’t always give you the best answers. Use your judgement to seek out the patterns to establish design priorities.