Jump to content


Android GCS UI


  • Please log in to reply
66 replies to this topic

#1 ligi

ligi

    Core Developer

  • Members
  • PipPipPip
  • 200 posts
  • Country: flag of Germany Germany


Posted 11 September 2011 - 02:51 PM

This post should open this part of the forum and merge some scattered threads. The Android GCS is in the make but lacks someone with GFX skills to polish the UI.
The easiest task to start with are the icons for the dashboard - I just took some pics with my camera and that does not look so good:
Posted Image

It got a bit better when I build in an option to include OpenPilot images but I found no suitable image for the StatusVoice and the Connection-Icon ( image of the PipX there - that is the right topic but far from intuitive ) will not be clear to everyone - so replacements for those both would be a great start.
Posted Image

Also I would need a Icon for the UAVObject Browser - to be honest - I have no idea how that could look like - thats why I count on the creativity of you guys ;-)

A second - a bit more complex construction site is the connection indicator ( the red square at the top ) - at the moment it is very simple ( red square -> disconnected ; green square -> connected ) - this also needs to be polished. I want some pumping/blinking correlating to the data-flow in there to see if the connection is good - and perhaps the RX-TX bytes/sec - but I am not sure about that yet. Any Ideas here are welcome!

#2 joecnc2006

joecnc2006

    Key Member

  • Members
  • PipPipPip
  • 447 posts
  • Country: flag of United States United States


Posted 11 September 2011 - 03:01 PM

Connection Icon I would use something like the CC Board itself for now.

Attached Files


Thanks,
Joe
www.joescnc.com

#3 ligi

ligi

    Core Developer

  • Members
  • PipPipPip
  • 200 posts
  • Country: flag of Germany Germany


Posted 11 September 2011 - 05:18 PM

View Postjoecnc2006, on 11 September 2011 - 03:01 PM, said:

Connection Icon I would use something like the CC Board itself for now.

that would be very irritating as also the pro is supported ..

#4 Kenn Sebesta

Kenn Sebesta

    Controls Master!

  • Members
  • PipPipPip
  • 896 posts
  • Country: flag of Luxembourg Luxembourg


Posted 11 September 2011 - 07:58 PM

View Postligi, on 11 September 2011 - 02:51 PM, said:

A second - a bit more complex construction site is the connection indicator ( the red square at the top ) - at the moment it is very simple ( red square -> disconnected ; green square -> connected ) - this also needs to be polished. I want some pumping/blinking correlating to the data-flow in there to see if the connection is good - and perhaps the RX-TX bytes/sec - but I am not sure about that yet. Any Ideas here are welcome!

What do you think about having two small arrows, one pointing up and the other down. They can be different colors to represent the two directions, or be the same basic color and change to yellow and red when the data starts saturating the OP device. Underneath you could have the actual data speed itself, but that might take up too much vertical space. Another thought is to remove the text and only have arrows that have a continuous shift from green to red will be enough, which will allow you to see that data is indeed flowing. The arrows would be un-filled outlines if there were no data flow whatsoever.

#5 ligi

ligi

    Core Developer

  • Members
  • PipPipPip
  • 200 posts
  • Country: flag of Germany Germany


Posted 11 September 2011 - 10:21 PM

Yea I had the same feeling with the arrows - but i think more of left-right so we have a defined direction of the data-flow visual-wize - on the top left is the home button with an icon of some UAV - so the arrow pointing in this direction will say "to UAV"
The key questions here are:
- do we need the values? I vote for NO here;
- How do we vizualize the dataflow ( I do not like your idea here that there is a continuous shift between red and green - if there is no problem I do not want any red on my screen what so ever ;-)
- what connection-states do we have to visualize ( your idea there with only outlined arrows for no dataflow yet is very good )
  -> states: #1) no connection yet #2) good link #3) broken link #3) saturated link

#6 Kenn Sebesta

Kenn Sebesta

    Controls Master!

  • Members
  • PipPipPip
  • 896 posts
  • Country: flag of Luxembourg Luxembourg


Posted 11 September 2011 - 11:05 PM

View Postligi, on 11 September 2011 - 10:21 PM, said:

Yea I had the same feeling with the arrows - but i think more of left-right so we have a defined direction of the data-flow visual-wize - on the top left is the home button with an icon of some UAV - so the arrow pointing in this direction will say "to UAV"
The key questions here are:
- do we need the values? I vote for NO here;
- How do we vizualize the dataflow ( I do not like your idea here that there is a continuous shift between red and green - if there is no problem I do not want any red on my screen what so ever ;-)
- what connection-states do we have to visualize ( your idea there with only outlined arrows for no dataflow yet is very good )
  -> states: #1) no connection yet #2) good link #3) broken link #3) saturated link

1) Would up/down be more natural, since we talk about uploading and downloading? Although I like your point about having the arrow be directional to the UAV.
2) Values will be nice for comparisons, esp. if trying to troubleshoot. Perhaps it can be configurable to either show values or arrows, but not both.
3) You're right that using a color gradient is not good, as color-blind people will not recognize green from red. Could have an arrow that fills in from tail to head as data increases.
4) A broken link could be shown the same way as a "no dataflow" link. Is there an intrinsic difference between the two?

#7 joecnc2006

joecnc2006

    Key Member

  • Members
  • PipPipPip
  • 447 posts
  • Country: flag of United States United States


Posted 11 September 2011 - 11:06 PM

wouldn't the connection indication be at the top at all times and not a menu button, because when you are on different screens you would not see the connection button anyway.
Thanks,
Joe
www.joescnc.com

#8 ligi

ligi

    Core Developer

  • Members
  • PipPipPip
  • 200 posts
  • Country: flag of Germany Germany


Posted 12 September 2011 - 12:38 AM

@Kenn Sebesta
2) you can always press on the connection-part of the ActionBar and will get details - so lets start without values
3) let's develop that idea and get a GFX guy in who can make that look good
4) in my imagination a broken link is very flashy but a "no dataflow" is more like gentle in the background as this is the thing most people get first contact

@joecnc2006
the connection indication is part of the ActionBar concept and on top all the time ( or very most of the time - there are perhaps scenarios where we need this real estate otherwise )

#9 grass man

grass man

    We call him: UI God

  • Members
  • PipPipPip
  • 35 posts
  • LocationChicago, IL
  • Country: flag of United States United States


Posted 12 September 2011 - 03:48 AM

What's up guys? I've been working on the GCS gauges and a small quad, but I can lend a hand here for graphics. I'll be looking at this tomorrow evening for sure!

#10 peabody124

peabody124

    Crash Dummy

  • Administrators
  • 4110 posts
  • LocationHouston, TX
  • Country: flag of United States United States


Posted 12 September 2011 - 04:03 PM

View Postgrass man, on 12 September 2011 - 03:48 AM, said:

What's up guys? I've been working on the GCS gauges and a small quad, but I can lend a hand here for graphics. I'll be looking at this tomorrow evening for sure!

I loved your initial sketchups.  Is the GCS work something that can be pushed to a branch or more sketches?

#11 LondonFlyer

LondonFlyer

    Key Member

  • Members
  • PipPipPip
  • 31 posts
  • LocationLondon
  • Country: flag of United Kingdom United Kingdom


Posted 12 September 2011 - 04:07 PM

View Postpeabody124, on 12 September 2011 - 04:03 PM, said:

I loved your initial sketchups.  Is the GCS work something that can be pushed to a branch or more sketches?

I'd love to see some images of what you've been working on to avoid duplication and also encourage the team to get them into a release.

#12 Spydmobile

Spydmobile

    Member

  • Members
  • PipPipPip
  • 799 posts
  • LocationFort Smith, NT CANADA
  • Country: flag of Canada Canada


Posted 15 September 2011 - 07:19 PM

I would like to point out that not all android interfaces are portrait and not all of them are this small. I have a Asus Transporter which runs android apps nicely with a nice big 10.1 inch touchscreen. The UI should work both ways and also offer a better interface to a detected larger screen.
Just my 2 cents.
Also, although I dont have a cc board yet, I would be happy to test the GCS on my tablet if needed.
Franco
OpenPilot: We take our time, we get it right, our systems rock. Just ask our pilots!
"Don't gain the world and lose your soul, wisdom is better than silver or gold." - Bob Marley
see my fleet in my Mad Scientists Lab at The Lab
---

#13 ligi

ligi

    Core Developer

  • Members
  • PipPipPip
  • 200 posts
  • Country: flag of Germany Germany


Posted 16 September 2011 - 01:33 PM

I will not forget the tablets as they are very interesting devices and get a big hype at the moment. I had DUBwise for UAVTalk run yesterday in our Hackerspace on a Samsung 10.1'' Honeycomb Android Tablet and the UI was not a bad experience. Also with the UAVTalk version I started using Fragments heavily that I can do "multiple fragments on one screen @ tablet" vs "one fragment at a time @ mobile" later. I focus on phone first as this is what most people carry with them on the field and what I have here to test. I am looking forward to buy a tablet in not to far future - but I wanted to wait for the right device ( Pen and good keyboard-dock are the key points here for me) First device that fits for me seems to be the lenovo android thinkpad ( http://www.androidce...-android-tablet ) - the screen could be more outdoor friendly - but the rest is pretty convincing.
But until then - just report here which screens are not optimal on your tablet and we can also work on that remote. You can start testing the app even without having a CC - you just get no data  but from the real estate on the screen things do not really change. Then you can also see that most things already work in Landscape AND Portrait mode ;-)

#14 K Wells

K Wells

    Member

  • Members
  • PipPipPip
  • 2228 posts
  • LocationTexas
  • Country: flag of United States United States


Posted 16 September 2011 - 01:57 PM

View Postligi, on 16 September 2011 - 01:33 PM, said:

I will not forget the tablets as they are very interesting devices and get a big hype at the moment. I had DUBwise for UAVTalk run yesterday in our Hackerspace on a Samsung 10.1'' Honeycomb Android Tablet and the UI was not a bad experience. Also with the UAVTalk version I started using Fragments heavily that I can do "multiple fragments on one screen @ tablet" vs "one fragment at a time @ mobile" later. I focus on phone first as this is what most people carry with them on the field and what I have here to test. I am looking forward to buy a tablet in not to far future - but I wanted to wait for the right device ( Pen and good keyboard-dock are the key points here for me) First device that fits for me seems to be the lenovo android thinkpad ( http://www.androidce...-android-tablet ) - the screen could be more outdoor friendly - but the rest is pretty convincing.
But until then - just report here which screens are not optimal on your tablet and we can also work on that remote. You can start testing the app even without having a CC - you just get no data  but from the real estate on the screen things do not really change. Then you can also see that most things already work in Landscape AND Portrait mode ;-)

Awesome work Ligi....I have your Software on my Droid X....I can read very well in Bright Texas sun...I wish I had your skills.
Looking Forward to the Maiden

#15 grass man

grass man

    We call him: UI God

  • Members
  • PipPipPip
  • 35 posts
  • LocationChicago, IL
  • Country: flag of United States United States


Posted 17 September 2011 - 06:30 PM

I worked on a mock-up this afternoon. I think the icons could definitely use some work, but could be a nice high contrast style for outdoors. I'll keep going and any critiques would be awesome!



Edit: The top bar contains an icon for connection in the middle; pulses bright blue when in rx/tx.

Attached Files


Edited by grass man, 17 September 2011 - 06:32 PM.


#16 dankers

dankers

    Janitor

  • Administrators
  • 5124 posts
  • Country: flag of Australia Australia


Posted 17 September 2011 - 06:40 PM

Wow!

#17 ligi

ligi

    Core Developer

  • Members
  • PipPipPip
  • 200 posts
  • Country: flag of Germany Germany


Posted 17 September 2011 - 06:51 PM

sweet!
can you give me the footage for that so I can bring it to live? I am not sure about the functionality top-part but the Pictogramming work and the overall appearance is really great and professional looking!

#18 Spydmobile

Spydmobile

    Member

  • Members
  • PipPipPip
  • 799 posts
  • LocationFort Smith, NT CANADA
  • Country: flag of Canada Canada


Posted 17 September 2011 - 07:10 PM

View Postgrass man, on 17 September 2011 - 06:30 PM, said:

I worked on a mock-up this afternoon. I think the icons could definitely use some work, but could be a nice high contrast style for outdoors. I'll keep going and any critiques would be awesome!



Edit: The top bar contains an icon for connection in the middle; pulses bright blue when in rx/tx.

Very nice :)
Edit: Upon closer inspection it is not only nice, but damn sexy too ;-)
Franco

Edited by Spydmobile, 17 September 2011 - 07:13 PM.

OpenPilot: We take our time, we get it right, our systems rock. Just ask our pilots!
"Don't gain the world and lose your soul, wisdom is better than silver or gold." - Bob Marley
see my fleet in my Mad Scientists Lab at The Lab
---

#19 Spydmobile

Spydmobile

    Member

  • Members
  • PipPipPip
  • 799 posts
  • LocationFort Smith, NT CANADA
  • Country: flag of Canada Canada


Posted 17 September 2011 - 07:12 PM

View Postligi, on 16 September 2011 - 01:33 PM, said:

I will not forget the tablets as they are very interesting devices and get a big hype at the moment. I had DUBwise for UAVTalk run yesterday in our Hackerspace on a Samsung 10.1'' Honeycomb Android Tablet and the UI was not a bad experience. Also with the UAVTalk version I started using Fragments heavily that I can do "multiple fragments on one screen @ tablet" vs "one fragment at a time @ mobile" later. I focus on phone first as this is what most people carry with them on the field and what I have here to test. I am looking forward to buy a tablet in not to far future - but I wanted to wait for the right device ( Pen and good keyboard-dock are the key points here for me) First device that fits for me seems to be the lenovo android thinkpad ( http://www.androidce...-android-tablet ) - the screen could be more outdoor friendly - but the rest is pretty convincing.
But until then - just report here which screens are not optimal on your tablet and we can also work on that remote. You can start testing the app even without having a CC - you just get no data  but from the real estate on the screen things do not really change. Then you can also see that most things already work in Landscape AND Portrait mode ;-)

Thanks Ligi, I downloaded it, and installed it on my Tablet, I will play with it a bit and try and return with some useful feedback, thank you so much for making the OpenPilot project cross-platform !!!!
Franci
OpenPilot: We take our time, we get it right, our systems rock. Just ask our pilots!
"Don't gain the world and lose your soul, wisdom is better than silver or gold." - Bob Marley
see my fleet in my Mad Scientists Lab at The Lab
---

#20 grass man

grass man

    We call him: UI God

  • Members
  • PipPipPip
  • 35 posts
  • LocationChicago, IL
  • Country: flag of United States United States


Posted 17 September 2011 - 07:43 PM

Thanks everyone!

Ligi, I can send you the photoshop file and/or all the parts separately in various active-deactivated states. Which do you prefer?

Should I make them PNG, JPG?

Edited by grass man, 17 September 2011 - 08:26 PM.