spiceofdesign's avatar

Phone Concept (elementary)

104 Favourites
44 Comments
13K Views
An elementary phone concept design, using a single physical home button. (Numbering top to bottom, left to right)

1. Standard application view (application name & symbolic ion in top left, system indicators on top right, then main toolbar and application content)
2. Application launcher (opens on single press of home button, double press auto selects search field)
3. Notifications (standard drag from top, possibly add WiFi/Bluetooth/Rotation etc toggles here)
4. Incoming call (same as standard popup view)
5. Running applications/application switcher (accessed by long press of home button - needs work since it is basically the same as android currently)
6. Lockscreen (could do with notification support)

UPDATE 28/5/13
Changes
1. Smaller status bar, app name removed, clock centred.
2. Function toggles and larger notifications.
3. Full screen call interface with icons instead of text.
4. New application switcher idea. Far from done, but a definite improvement over the previous one.
5. New lock screen with notifications, emergency calling and quick camera access.
IMAGE DETAILS
Image size
1160x1110px 579.3 KB
Published:
Comments44
anonymous's avatar
Join the community to add your comment. Already a deviant? Log In
AwedEven's avatar
I feel like the bars are too big. The idea is cool though
Stephen-Ritchie's avatar
Stephen-RitchieStudent Photographer
I want this to be real so bad!
PimmZ's avatar
looks really good

Liunli's avatar
jaw dropping :O
juampiursic's avatar
This is pretty cool! I was thinking this days of a eOS Mobile concept, got a lot of ideas but not the time to make a mock up, hope we can see more of this :D
schtocker's avatar
schtockerHobbyist Interface Designer
This is the concept design that I live for. Amazing work!
doubleaykay's avatar
Nice! An elementary launcher for Android with the same design as this would be sick!
Stephen-Ritchie's avatar
Stephen-RitchieStudent Photographer
I second this! 
Qw3rtz's avatar
No, a whole rom would be sick.
Isifth's avatar
Make two replies about this, hehe and a version for tablets would be great too!!
jerry91122's avatar
will be better when you doing launcher on android :)
mcourteaux's avatar
Just awesome!
iKlikla's avatar
iKliklaHobbyist Interface Designer
This should really be a new Mobile OS..
ArturoIlhuitemoc's avatar
I just can't handle how everyone keeps using the old Twitter logo, despite the new logo being already included in the elementary icon theme.
spiceofdesign's avatar
spiceofdesignHobbyist Interface Designer
I'll fix it in the next iteration. I managed to fix the Facebook logo, but my copy of elementary icons must be out of date.
TheVirtualDragon's avatar
TheVirtualDragonHobbyist Interface Designer
Hahaa, I was going to make a elementary phone concept....Now you have already got there before me...

Awesome job anyways!
ScionicSpectre's avatar
ScionicSpectreProfessional Digital Artist
Cool updates- I really appreciate how much detail you put into the simplicity, here. It's really coming together. I definitely like the lock and app switcher screens more. The consistent use of dark bottom toolbars for system-side navigation is a great idea, I think. Helps the user 'feel' what mode their in instead of guessing.
moeenn's avatar
moeennStudent Interface Designer
This kicks ass. Neat as hell
d14gvn's avatar
this should be ported as a MIUI theme, could be possible?
tkarika's avatar
I agree.. :)
DanRabbit's avatar
DanRabbitProfessional Interface Designer
Very cool!

I think maybe the vertically padding in your toolbars is a bit too much.

I'm not sure I'm in love with the statusbar. It feels too tall (I think it's about half that size on iOS) to me and I'd like to see the e logo removed.

I think the notifications screen is your strongest one here. It looks really slick. But I wonder if we can't fit more notifications on screen with a more minimal design and I agree it could be handy to have other kinds of quick actions available.

I would definitely consider adding things to the lock screen that you'd want to get to quickly like music controls and the camera. Another thing to consider is getting rid of the statusbar background and overlaying the icons directly to the wallpaper. Also, your clock is duplicated :p Maybe it'd be a good idea to move your clock to the inside (why not center?) so that it can be removed on this screen without disturbing the typical layout. Also check out this lockscreen design. The minimalism is great: [link]

I think I'd definitely like to see incoming call buttons with symbolic icons instead of text and with the primary action on the right side. What do you think of having a more photo-centric design like this? [link] also what about taking it full screen like this? [link] Another thing to consider is a way to decline the call, but still take action such as reply with a text message or set a reminder to call back (killer features in iOS)

There was a super kill multitasking video concept floating around but I can't find it right now, I'll try to dig it up so I can link you.
spiceofdesign's avatar
spiceofdesignHobbyist Interface Designer
The vertical padding is to emulate the look of elementary OS as closely as possible. The click able area for each would still be the full height of the bar, and so would not suffer from the smaller appearance, but would still have the slicker small appearance opposed to a larger clumsier button.

I think the main reason is due to the symbolic icons and text indicating what application you are in that makes it so large (although I've just realised one of them is wrong). The e logo is really necessary, I just didn't have a replacement icon for each of the other things (ie I don't have a logo for incoming call, slingshot, notifications, running applications or a lock screen). Moving the clock would make sense in that it would be the same as elementary OS.

I think the notifications could easily be made larger with a cut down design and the addition of switches should be fairly easy.

The lock screen is one I am note entirely happy with. I think rather than worry about duplicated text it would be better to just get rid of the bar on the lock screen and utilise larger indicators beneath the clock along with notifications.

Incoming call with icons make sense (although I cannot find elementary phone symbolic) and is what I would have used had I got the icons. I also was going for a much larger photo, if not full screen, but I was too lazy to get another photo that was big enough. I think the options for declining can be a separate page, since an action like speaker phone would not be useful until the call was answered, and so sending a message would wait until the call was rejected, otherwise the primary function of the page (answering or rejecting a call) would be confused.

I would say the multitasking is my least favourite of the different screens, since there is no much potential to me innovative here.
DanRabbit's avatar
DanRabbitProfessional Interface Designer
If you look at the toolbars in the desktop apps, there really isn't that much vertical padding. I think you could save a few pixels there :p

I'm not sure having window titles is really important, to be honest. I feel like most apps should be fairly recognize-able by their contents.

I dunno, I actually scaled down the clock a bit in my mockup as compared to what is in the desktop lightDM just to make more room for notifications xD But definitely I want to explore some more lock screen concepts. Especially unlocking. I hate to just grab the more-or-less iOS and design and say "yep this is good."

Ah, we inherit GNOME icons in some places. I'm still working on making the theme completely independent.

What do you think about the swipe-menu thing that iOS does? I saw a concept where someone showed options for answering the call as well so you could for example answer a video call as "audio only".

Did you see that page I linked? The concept seems really cool. I'm wondering though, if it wouldn't be good to just use the same kind of window overview as we have on the desktop. Would the thumbnails just be too small?
spiceofdesign's avatar
spiceofdesignHobbyist Interface Designer
Updated with some of your suggestions implemented, with some semblance of a card system implemented without the scaling issues to make it blurry.
anonymous's avatar
Join the community to add your comment. Already a deviant? Log In