pythonkc / pythonkc-com

Django app for pythonkc.com.
18 stars 15 forks source link

Design/implement a mobile web experience #4

Open estebistec opened 12 years ago

estebistec commented 12 years ago

This is not a trivial one... obviously for later.

Overview

It would be a good show if our site detected mobile user agents and provided a better targeted experience for those devices.

Tasks

juliaelman commented 12 years ago

I'd love to be the design part of this if no one else wants a go! Not sure I know enough about detection schema to raise my hand to that one. I'd be happy to do some research though.

estebistec commented 12 years ago

I can work on the detection part. I had some vague ideas for the mobile design. Once the initial site deploy settles in and some small adjustments get out maybe we can compare notes on it. You can definitely take lead on it though if you like.

juliaelman commented 12 years ago

Let's touch base post lightning talks on Saturday!

estebistec commented 12 years ago

I've been looking around at user-agent middleware detection today. I'm not liking how many of them are trying to do too much on the django side (e.g., predict where your "mobile templates" live), and more or less none of them tell you if the UA is a tablet. I was hoping for one of the existing packages to simply do [1][2], tablets too, and set an attribute on the request for maximum flexibility.

So, I'm either going to see if I can use minimal parts from [3] or just write the simple middleware based on [1][2] directly in our site. If I get un-lazy then I would figure our how to detect tablets specifically, but I think to start with it's okay if those UA's get the standard site. wurfl [4] is a possibility too, but may be overkill for simple mobile/tablet detection.

[1] http://mobiforge.com/developing/story/build-a-mobile-and-desktop-friendly-application-django-15-minutes [2] http://www.entzeroth.com/code - His mobile post updates the UA string list a bit [3] https://github.com/gregmuellegger/django-mobile [4] http://celljam.net/

estebistec commented 12 years ago

Julia, you briefly showed me a mobile design at our last meetup. Is there any chance you could scan that in and link/attach it here? Maybe based on that I can have mobile-detection in place and we could be down to dev'ing the specific templates/views that would be needed for the design.

juliaelman commented 12 years ago

Ok! Here is the scan of my silly drawing. Also, when I say, "What's the deal with maps on phones?" I think that I was wanting to do some research on how you create maps that interact with different devices OR if google maps works the same on any mobile device. I feel like there is more to it and will try to do some reading before the meeting.

Also, I remember that we agreed to have them link directly to the meetup.com site instead of creating a detail page about our upcoming event. That is what 3a signifies.

And sorry about the bleed through writing!!!

Silly drawing

estebistec commented 12 years ago

I'm going to have something basic worked out (probably on a branch) later today or this evening.

estebistec commented 12 years ago

Julie, I created a branch called "mobile" [1], added mobile detection, and updated the views to render the proper templates. So, to implement the mobile site the only files that need editing now are those templates [2] and the mobile CSS [3] which they use.

Fair warning: the mobile pages are very ugly right now. I merely placed the relevant markup to get them started and didn't really style them at all. That's basically how far I got.

To work with this branch:

git checkout -b mobile origin/mobile

When you run locally from the branch, use something like Firefox's user-agent switcher add-on to trigger the mobile site. If you have any trouble running it, let me know.

[1] https://github.com/pythonkc/pythonkc.com/tree/mobile [2] https://github.com/pythonkc/pythonkc.com/tree/mobile/pythonkc_site/templates/mobile [3[ https://github.com/pythonkc/pythonkc.com/blob/mobile/pythonkc_site/static/mobile.css