Jump to content


Photo

Dribbble Competition #2


  • Please log in to reply
49 replies to this topic

#1 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 31 August 2011 - 03:43 PM

Hello boys and girls,

Al ran a fantastic competition the other week to get your hands on a Dribble invite. I'd like to carry on the tradition with a little competition of my own.

What do you need to do? Design a new interface for Google Maps. To be clear, i'm not asking for a working interface, purely a JPG of how you envisage an updated version would look considering current trends. Baring in mind that Dribbble only allows a 400x300 preview, you will be hard pressed to get an entire screen into that space. So, design it full size and include a 400x300 "cut" of your most precious element, so you will have 2 images. One full size, and one 400x300 cut out. I say this size because if you decide to use it as your debut shot, these are the dimensions you'll need to provide it in.

I'll give you a week to complete it. Next Wednesday by 6pm all entries will be in and I will pick the winner soon afterwards.

Any questions, drop me a comment below.

Looking forward to seeing what you guys can come up with! Best of luck!

#2 MikeChipshop

MikeChipshop

    Small but imperfectly formed

  • Privileged
  • PipPipPipPipPipPip
  • 8,804 posts
  • Gender:Male
  • Experience:Nothing
  • Area of Expertise:Designer

Posted 01 September 2011 - 08:37 AM

Argh and i'm supposed to be busy this week ;)

#3 rubots

rubots

    Dedicated Member

  • Members
  • PipPip
  • 203 posts
  • Gender:Male
  • Location:UK
  • Experience:Advanced
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 08:43 AM

Sounds good Mark.

#4 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 09:10 AM

I know you guys are busy, but it would be great to see some entries from you!

#5 MikeChipshop

MikeChipshop

    Small but imperfectly formed

  • Privileged
  • PipPipPipPipPipPip
  • 8,804 posts
  • Gender:Male
  • Experience:Nothing
  • Area of Expertise:Designer

Posted 01 September 2011 - 09:21 AM

I'll do my best!
To be honest i'm looking at GMaps now figuring out what i could do. It's pretty solid as it is. damn.

#6 ayoungh

ayoungh

    Web Guru

  • Privileged
  • PipPipPipPipPip
  • 2,057 posts
  • Gender:Male
  • Location:London
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 09:57 AM

This is a hard one but I have a few ideas and will defo give it a go :) Great comp

#7 kingy da killa

kingy da killa

    Free man on the land

  • Privileged
  • PipPipPipPipPip
  • 2,144 posts
  • Gender:Male
  • Location:London SW
  • Experience:Intermediate
  • Area of Expertise:Web Developer

Posted 01 September 2011 - 11:00 AM

wehey another comp :)

this is a tricky one though !

#8 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 11:40 AM

Agreed it is quite tricky. But you should be able to create some stunning elements for the map itself (place markers, rotate map, zoom in/out etc), then it's just a case of making the navigational links pretty :D

I've toyed with creating a mock-up myself, and I would definitely ditch the white. I know it's Google's colour, but a little variation wouldn't do any harm!

#9 ZaLiTH

ZaLiTH

    Dedicated Member

  • Members
  • PipPip
  • 182 posts
  • Gender:Male
  • Location:South Africa
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 01:25 PM

What do you need to do? Design a new interface for Google Maps.

Well, not that I'm really too interested in getting myself a Dribbble account, but I think I'll take part in this one too. :D There have always been a few things about Maps that I would do differently. :p

#10 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 01:36 PM

Good man! Looking forward to seeing what you come up with.

#11 rubots

rubots

    Dedicated Member

  • Members
  • PipPip
  • 203 posts
  • Gender:Male
  • Location:UK
  • Experience:Advanced
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 02:39 PM

Hang on, are we redesigning the actual maps UI or are we doing the site as well.

#12 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 02:50 PM

The maps UI - By navigation I mean the Satellite & Traffic links in the top right of the map.

How you display the map is entirely up to you. You could use the top-down world map, or the street view. If you really wanted to, you could rework the map entirely. If this was a project brief, the client would be saying:

Does that make sense? :s

EDIT: The bit about a client made it even more confusing!

Edited by MarkJenner, 01 September 2011 - 03:05 PM.


#13 ZaLiTH

ZaLiTH

    Dedicated Member

  • Members
  • PipPip
  • 182 posts
  • Gender:Male
  • Location:South Africa
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 02:54 PM

"I want Google Maps on my website, but I don't want it to look like Google Maps does... put your own spin on it."

Does that make sense? :s

So... Is this essentially designing a custom interface for a map 'widget' like this? Or would it be the full sized Google Maps page? :unsure:

Edit: Just following suite with the previous comment edit. :)

Edited by ZaLiTH, 01 September 2011 - 03:27 PM.


#14 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 03:05 PM

Full sized Google Maps page.

#15 ZaLiTH

ZaLiTH

    Dedicated Member

  • Members
  • PipPip
  • 182 posts
  • Gender:Male
  • Location:South Africa
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 01 September 2011 - 03:26 PM

Awesome.. That's what I originally thought. And, to be honest, what I was hoping for... :)

#16 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 05 September 2011 - 08:43 AM

2 days to go, and no entries yet? :unsure:

#17 MikeChipshop

MikeChipshop

    Small but imperfectly formed

  • Privileged
  • PipPipPipPipPipPip
  • 8,804 posts
  • Gender:Male
  • Experience:Nothing
  • Area of Expertise:Designer

Posted 05 September 2011 - 08:46 AM

Sorry man, been hell busy. Am going to try and have a look at it this evening though :D

#18 ZaLiTH

ZaLiTH

    Dedicated Member

  • Members
  • PipPip
  • 182 posts
  • Gender:Male
  • Location:South Africa
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 05 September 2011 - 08:53 AM

2 days to go, and no entries yet? :unsure:

That means we still got 2 days to finish polishing it... :lol: I've got one coming, I'll probably send it to you either tonight or tomorrow.

#19 ayoungh

ayoungh

    Web Guru

  • Privileged
  • PipPipPipPipPip
  • 2,057 posts
  • Gender:Male
  • Location:London
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 05 September 2011 - 04:28 PM

I been super busy too, You may need to extend the date :s

#20 MikeChipshop

MikeChipshop

    Small but imperfectly formed

  • Privileged
  • PipPipPipPipPipPip
  • 8,804 posts
  • Gender:Male
  • Experience:Nothing
  • Area of Expertise:Designer

Posted 06 September 2011 - 09:32 PM

I been super busy too, You may need to extend the date :s


I'll ditto that :p
Got caught up in the final surge of a big project and doubt i'll be able to get an entry in before the weekend :(

#21 ayoungh

ayoungh

    Web Guru

  • Privileged
  • PipPipPipPipPip
  • 2,057 posts
  • Gender:Male
  • Location:London
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 07 September 2011 - 01:11 AM

Ok, I did a quick one. Not exactly what I had in mind but similar :) Enjoy

Attached File  Map-ui.jpg   355.91KB   87 downloads

This is the full screenshot.

Attached File  Snap.jpg   57.03KB   84 downloads

This is the snapshot.

General logic behind it is that it is based on Google. The middle plus icon is the menu, this is draggable to anywhere in the UI, To zoom in, click the plus, Right click the plus to zoom out. Each colour on the icon opens a menu e.g. search, map type etc

ENJOY

#22 neilp

neilp

    Privileged

  • Privileged
  • PipPipPipPip
  • 698 posts
  • Gender:Male
  • Experience:Advanced
  • Area of Expertise:Designer/Coder

Posted 07 September 2011 - 10:43 AM

Now having a go....shouldn't be long....hmmmmmm?

#23 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 07 September 2011 - 10:51 AM

For the guys who've already submitted a design, would you mind if we extended the competition until Monday morning?

I'm more than happy to extent the deadline if those who have already submitted don't mind. Gives others more time to put something together, and you guys to tweak anything you feel may need tweaking.

#24 ZaLiTH

ZaLiTH

    Dedicated Member

  • Members
  • PipPip
  • 182 posts
  • Gender:Male
  • Location:South Africa
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 07 September 2011 - 10:56 AM

I like that idea.. :D Maybe I'll find some time to finish the sidebars properly then. :p

#25 ayoungh

ayoungh

    Web Guru

  • Privileged
  • PipPipPipPipPip
  • 2,057 posts
  • Gender:Male
  • Location:London
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 07 September 2011 - 11:25 AM

I don't mind :)

#26 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 09 September 2011 - 08:35 PM

Sorry guys, it's just been brought to my attention that I haven't confirmed the extention! Apologies. The comp is now open until Monday evening, with the winner being chosen Tuesday morning.

So you've still got time to polish your designs (or in some cases, start them :p) !

#27 Ste Hughes

Ste Hughes

    Obviously Jesus

  • Privileged
  • PipPipPipPip
  • 898 posts
  • Gender:Male
  • Experience:Advanced
  • Area of Expertise:SEO

Posted 09 September 2011 - 08:38 PM

Epic :)

Not had time yet

Shall get one done tomorrow :)

#28 MikeChipshop

MikeChipshop

    Small but imperfectly formed

  • Privileged
  • PipPipPipPipPipPip
  • 8,804 posts
  • Gender:Male
  • Experience:Nothing
  • Area of Expertise:Designer

Posted 10 September 2011 - 01:15 PM

Absolutely racking my brains on this but having one of those days were nothing works out right!

#29 rubots

rubots

    Dedicated Member

  • Members
  • PipPip
  • 203 posts
  • Gender:Male
  • Location:UK
  • Experience:Advanced
  • Area of Expertise:Designer/Coder

Posted 10 September 2011 - 02:52 PM

Is it me or has Google redesigned the maps UI over the last few days?

#30 superkaty

superkaty

    Forum Newcomer

  • Members
  • Pip
  • 61 posts
  • Gender:Female
  • Location:Surrey
  • Experience:Intermediate
  • Area of Expertise:Web Designer

Posted 10 September 2011 - 03:15 PM

Is it me or has Google redesigned the maps UI over the last few days?

Well, you can't blame them, there is a dribbble invite up for grabs!

#31 ayoungh

ayoungh

    Web Guru

  • Privileged
  • PipPipPipPipPip
  • 2,057 posts
  • Gender:Male
  • Location:London
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 10 September 2011 - 10:03 PM

Well, you can't blame them, there is a dribbble invite up for grabs!


LOL

#32 Sazzad

Sazzad

    Privileged

  • Privileged
  • PipPipPipPip
  • 633 posts
  • Gender:Male
  • Location:New York, New York
  • Experience:Advanced
  • Area of Expertise:Designer/Coder

Posted 11 September 2011 - 12:47 AM

Good thing I caught this one in time this time. This is definitely a tough one consider Google already has one of the most reliable and easy style of viewing the map. Where are you rainy day that gives me my creative ideas.

Not sure if I grasped the concept correctly but here's my entry.

This is the landing page:
Posted Image

This is the active search page:
Posted Image

This page I added a simple button on the bottom to bring up the search bar that you see on the landing page.

My view is similar to that of Google but I would like if these minor changes were made by Google. I find the sidebar and the top search bar to be in the way.

Edited by Sazzad, 11 September 2011 - 01:20 AM.


#33 Merkury

Merkury

    Forum Newcomer

  • Members
  • Pip
  • 1 posts
  • Gender:Male
  • Experience:Intermediate
  • Area of Expertise:Web Designer

Posted 11 September 2011 - 01:20 AM

My two cents. Hope you like it :)

Full design:
Posted Image

400x300:
Posted Image
(.png for better quality)


Full design JPG
400x300 JPG

#34 ZaLiTH

ZaLiTH

    Dedicated Member

  • Members
  • PipPip
  • 182 posts
  • Gender:Male
  • Location:South Africa
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 12 September 2011 - 08:41 AM

Well, unfortunately my PC at home somehow got infected with a virus, so I'm keeping it offline and not using any flash drives or external drives for the moment.. I didn't really get a chance to finish what I started, but here is the latest I have from before the virus issue.

Anyway, here is my very rough concept at a "Minimal Google Maps" interface:

Full View:
Attached File  ZaLiTH-full.jpg   459.73KB   69 downloads

400x300 Preview:
Attached File  ZaLiTH-preview.jpg   146.21KB   64 downloads

Basic Usage Ideas
The search panel (left) only show information relative to the current session. So if a search was done for an address, only the search results would show up first. Clicking the 'more' button would then expand the panel to allow the user to fine-tune the search results.

The map controls panel (right) will hold all map-specific controls, the zoom and scale bars will always be visible, then extra options such as map type (street/satellite) and street-view will be hidden until needed (i.e.: map zooms in far enough, or user clicks the 'more' button).

The map location pop-up can have links specific to that location for directions, photos, landmarks and 'email this location'. I honestly couldn't decide what else to include there, so the 'more' option was just to leave room for more later... So, that could probably be removed after all. :)

Resources
All resources except the Google logo are either drawn myself or from these two free packs: Icons are from the Glyphish pack, and the circle button bases and arrows are from PremiumPixels.

#35 pandad

pandad

    Web Guru

  • Privileged
  • PipPipPipPipPip
  • 1,656 posts
  • Gender:Not Telling
  • Experience:Nothing
  • Area of Expertise:Nothing

Posted 12 September 2011 - 08:42 AM

Does this close today now? If so ill wait till #3... ;)

#36 neilp

neilp

    Privileged

  • Privileged
  • PipPipPipPip
  • 698 posts
  • Gender:Male
  • Experience:Advanced
  • Area of Expertise:Designer/Coder

Posted 12 September 2011 - 10:58 AM

Here is my entry, good luck all :bangb:

Attached Files



#37 MikeChipshop

MikeChipshop

    Small but imperfectly formed

  • Privileged
  • PipPipPipPipPipPip
  • 8,804 posts
  • Gender:Male
  • Experience:Nothing
  • Area of Expertise:Designer

Posted 12 September 2011 - 11:05 AM

I'm not going to get an entry done in time :(

It's my birthday today and the missus has banned me from doing any work and relegated me to the pub... Stoked :D

Good luck everyone.

#38 MarkJenner

MarkJenner

    Advanced Member

  • Members
  • PipPipPip
  • 472 posts
  • Gender:Male
  • Location:London, England
  • Experience:Intermediate
  • Area of Expertise:Designer/Coder

Posted 12 September 2011 - 11:20 AM

relegated me to the pub



Mike, your missus should get the invite purely for this! lol

Happy birthday dude.

Some good entries so far!

#39 seedism

seedism

    Privileged

  • Privileged
  • PipPipPipPip
  • 501 posts
  • Gender:Male
  • Location:United Kingdom
  • Experience:Intermediate
  • Area of Expertise:Entrepreneur

Posted 12 September 2011 - 02:55 PM

Interesting competition, never did any design like this before.
started late last night, really tired so not the cleanest finish as hoped for.

Not easy, but I had a good laugh.

First is a 400x300 thumbnail-ish image

Attached File  400x300.jpg   136.39KB   84 downloads

full sized image

Attached File  GoogleUI.jpg   537.48KB   116 downloads

In use.

Attached File  google maps.jpg   477.63KB   108 downloads

Edited by seedism, 12 September 2011 - 03:00 PM.


#40 Sazzad

Sazzad

    Privileged

  • Privileged
  • PipPipPipPip
  • 633 posts
  • Gender:Male
  • Location:New York, New York
  • Experience:Advanced
  • Area of Expertise:Designer/Coder

Posted 12 September 2011 - 05:50 PM

Excellent entry seedism. For some reason I feel like I'm playing Starcraft.




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users