Deviant Login Shop  Join deviantART for FREE Take the Tour


Submitted on
September 30, 2013
Image Size
4.6 MB


2,277 (2 today)
18 (who?)


Creative Commons License
Some rights reserved. This work is licensed under a
Creative Commons Attribution-Share Alike 3.0 License.
GNOME-Shell mobile layout mockup by nsrosenqvist GNOME-Shell mobile layout mockup by nsrosenqvist
I wanted to test out some design ideas surrounding the GNOME-Shell after I've seen all the nice new updates that came with 3.10. This is in no way completely thought through, it's just a quick attempt at translating the desktop UI onto a smaller touch device (I know that there is no way of accessing the overview except through a hardware button). All comments and critiques are welcome!

# UPDATE 2013-10-06:
I decided to make a second revision of the design and this time basing it on the 1280x768 display of a LG Nexus 4, so that I get a proper reference for the position and size of elements.

* The shape of elements adhere closer to the style of GNOME-Shell's default theme but I've kept my changes that I think improves the user experience. An example is that I've chosen a flatter look and removed borders of most elements.
* The overview now also has the search bar so that it's more accessible.
* An example of the window list overflowing has been provided.
* The pagination on the view showing all installed apps ordered by title are now placed horizontally, differing from the desktop GNOME-Shell since the swiping gesture is then more comfortable on a handheld device.
* An example of a search view has been added.
* An example for the notifications view in the overlay has been added.

p.s. Sorry #GIMP-Artists, this time I implemented the designs in Inkscape since I found it to be much easier handling "objects" like interface elements and aligning objects with it. Though this presentation of all screens has been put together in The GIMP :)

The search results are supposed to show a longer list with results from the web, even direct results from google/ddg, I just didn't have the time to make it more detailed.
Add a Comment:
Lesik2008 Featured By Owner Oct 14, 2013  Student Filmographer
Funny, I just made a mockup of GNOME on phones by myself and posted it on Google+ some weeks ago. Interesting that we had the same idea :)
nsrosenqvist Featured By Owner Oct 15, 2013  Hobbyist General Artist
Yeah :) I got kinda tired of only seeing cool mockups for Unity Touch, I wanted to show some love for GS as well :P
Lesik2008 Featured By Owner Oct 15, 2013  Student Filmographer
Oh, there are even Unity mockups? I've got a looot to check out now.
nsrosenqvist Featured By Owner Oct 16, 2013  Hobbyist General Artist
Spiceofdesign has a couple of nice mockups of both unity for desktop and mobile:…

On Ubuntu App Developers you'll see a lot of nice app designs by Lucas Romero Di Benedetto:…
Lesik2008 Featured By Owner Oct 17, 2013  Student Filmographer
Thanks for the links! I'm not really a fan of Ubuntu, but I'll join that community anyway :)
I agree, spiceofdesign's art is awesome.
nsrosenqvist Featured By Owner Oct 18, 2013  Hobbyist General Artist
I'm there mostly to see how the app ecosystem evolves :) what happened to your GS-mockup? I can't seem to find it in your deviantart gallery.
Lesik2008 Featured By Owner Oct 18, 2013  Student Filmographer
Oh, it was a quick GIMP edit using a few screenshots from GNOME on my laptop, nothing fancy, so I didn't post it on dA. I posted it in the Google+ GNOME community instead :)
nsrosenqvist Featured By Owner Oct 18, 2013  Hobbyist General Artist
ah, ok :)
poinck Featured By Owner Oct 6, 2013
That mockup is the proof, that Gnome-shell is suitable for any screen-size. (o:
nsrosenqvist Featured By Owner Oct 6, 2013  Hobbyist General Artist
Thanks! I've just updated the design, do think it was an improvement?
Add a Comment: