↵

MIT website redesign(web.mit.edu)

5 years ago from Alexander Stocker, Founder

  • Mike SwartzMike Swartz, 5 years ago

    Hey designerds, figured I'd weigh in on some of the thought process here, you might find it interesting:

    • Colors: Totally agree, today's theme is super Dropboxy. There are 32 color themes at MIT's disposal day-to-day plus custom colorways keyed off the daily art. These were all made to be accessible (AA or better), so had to follow pretty strict contrast/value rules to get there. Some are better than others, but they're made to be diverse and impermanent as the site cycles through them each day. Tomorrow it'll be different.
    • Search this is where a lot of effort went. MIT is a really diffuse place, and the main problem we saw in our research with users was digital wayfinding. We decided to make search the centerpiece and focused on getting it to be fast and useful (and even fun). One use case we worked on a lot was the mobile interface, as the site is really optimized for mobile sizes and handheld use. It has a custom elasticsearch installation that was heavily tested to make sure it was ACTUALLY useful in the real world. There are a few easter-eggs too ;) Full-page takeover on desktop is a side-effect of some of our mobile choices, which bubbled up to desktop. Try it on your phone!
    • Content strategy: the coolest part of the old MIT.edu was that it changed everysingleday. We saw this as a feature, not a bug, and designed around this. Each day the site highlights one small aspect of MIT, or one big discovery, or an interesting person. It tells the story of MIT in the aggregate, but over time instead of across (page)space. Many universities resort to "box-filling" to get all the aspects of their culture and academics on the homepage -- and you get a big huge homepage with each group fighting over page real estate. With MIT this was just impossible. So they made a really bold choice and are telling their story one piece at a time. It's also well suited to a daily email, which is rolling out at the same time.

    It's a quirky site, but MIT is a quirky place. We realized from the jump that in order to be "very MIT" it had to be smart, fast and weird. Judging by the comments I'd say we succeeded in the at least a few of those places. It's got a ways to go, but we think it's a great start for their writers, designers and engineers to build a platform for their community.

    36 points
    • Nic TrentNic Trent, 5 years ago

      Nice! Really cool to hear some of the thinking that went on. Can't help but wonder how feedback might differ if the design stacked the search on top of the spotlight like on mobile?

      But I also personally like the unique layout, simply because its unique.

      2 points
      • Mike SwartzMike Swartz, 5 years ago

        Thanks Nic! The split was a solution to really large sizes, but there can be an awkward in-between. The stacked layout at 1099px wide is actually my favorite view of it.

        1 point
    • Andrew Richardson, 5 years ago

      I love the content strategy aspect of this. It seems like there was a lot of thought put into handling a huge amount of information.

      It's really curious that you decided to change so much on a daily basis, did you do any testing around this aspect? I'd imagine there was a lot of consideration given to those who use the site daily vs those who only occasionally visit.

      0 points
      • Mike SwartzMike Swartz, 5 years ago

        Good question. MIT had actually been doing a version of this content strategy on their site since the early 2000s, so the Spotlight is something people in the community know and expect. We wanted to keep + build on that aspect of the site and make it even more content focused, but also respect the utility-oriented visitor trying to find a person, department or building quickly with minimal fuss.

        1 point
    • Hayden MillsHayden Mills, 5 years ago

      Thanks for sharing the reasons! It really helped me understand the goals of the redesign better. Cool stuff to read.

      2 points