Appstore Look

[MDave]

Ahh yeah looks like fingers do work, just tried out my DS. Though I was sure it didn't work before .

 

[foxblock]

Ok, thanks for confirming.

Looks like I don't have to cancel my pre-order now

 

[shill]

^My design. Hope you like it.
Sorry about the wonky text in the Categories and Profile bars.
Fonts:
Helvetica 18pt for the app titles
color: 6a6767
Helvetica 16pt for description/author/ et cetera
color: 6a6767

Dark Menu!

For top downloads text, I used pure black.

I can convert this to CSS/HTML for you if you approve of it. If someone else can code it better, I'd gladly provide all graphics and any help I can. I use an online converter; I don't code by hand. Here's what I would/will be using. http://psd2cssonline.com/node/531

Big buttons ftw!

 

[dflemstr]

^My design. Hope you like it. Also working on a Dark version.

Big buttons ftw!

That looks very difficult to implement in HTML. Note that craigix probably won't bother with too many JS hacks nor AJAX.

Also, I don't like the prospect of paying 5 bucks for Firefox

 

[shill]

^My design. Hope you like it. Also working on a Dark version.

Big buttons ftw!

That looks very difficult to implement in HTML. Note that craigix probably won't bother with too many JS hacks nor AJAX.

Also, I don't like the prospect of paying 5 bucks for Firefox

I disagree. He is using the combination of CSS and HTML, correct? If this is the case, it would be the same as the others in terms of difficulty.

And you know that I'm not setting the REAL price for Firefox...

 

[stustaff]

I am it turns out slightly confused/concerned

why is the design text so large and buttons etc so big?

this is for THE PANDORA RESOLUTION, that is why everything is big and in a small space. It has to be that size or you can hardly see it on the Pandora screen. It is NOT possible to have a bar on both sides like the gp2x file archive, it make it just too small, so they are all on the left for that reason.

So how are we going to use the pandora to browse normal websites? one of the MAIN reasons why I bought it!

I assumed we would be able to use sites that aren't optimised for the pandora? but Craig in effect is saying that a normal web site IE one not designed for PANDORA RESOLUTION can hardly be seen?

Surely the design answer here is you make a NORMAL good looking web site for the Pandora Apps and that the Pandora be capable of being used to look at the normal web site?

If it cant then its not going to be much good for web stuff on the go...or am I missing something?

 

[shill]

I am it turns out slightly confused/concerned

why is the design text so large and buttons etc so big?

this is for THE PANDORA RESOLUTION, that is why everything is big and in a small space. It has to be that size or you can hardly see it on the Pandora screen. It is NOT possible to have a bar on both sides like the gp2x file archive, it make it just too small, so they are all on the left for that reason.

So how are we going to use the pandora to browse normal websites? one of the MAIN reasons why I bought it!

I assumed we would be able to use sites that aren't optimised for the pandora? but Craig in effect is saying that a normal web site IE one not designed for PANDORA RESOLUTION can hardly be seen?

Surely the design answer here is you make a NORMAL good looking web site for the Pandora Apps and that the Pandora be capable of being used to look at the normal web site?

If it cant then its not going to be much good for web stuff on the go...or am I missing something?

Browsing a web site that is larger than the Pandora's screen will result in the much-hated horizontal scrolling. We can view these sites in their entirety; however, optimized sites will eliminate horizontal scrolling and minimize vertical scrolling so you can get what you need and get out. An app store does not need to be designed like a an old Geocities site and look terrible. For the appstore, a simple look is what we need.

 

[S-r-ex]

Well, here's my go. This is just the menu and header at a very early stage, though. But I just want someone with a dev device to see if the current text is clearly visible on the Pandora screen, I can't tell with my monitor since it has a different DPI than the Pandora screen (which is 217.1)

The gray lines represents borders to compensate for scroll-, status- and navigation bars (mockup navbar included), and will not actually be there. However, the gray line next to the menu border is only representative for text and images, so that they won't go "beneath" the menu border, but any background will. I'll ponder about that background tomorrow since it's getting late here. It'll look better tomorrow night, but I think I'll stick to the Pandora's black color as a base for this theme.

EDIT:

Font:
Times New Roman
35px
150% height stretch
85% width stretch
200(???) letter distance for header, 0 for menu (PS doesn't say what unit)

 

[zhasha]

I might waste some time on making a pretty appstore section in pmenu at some point in the near future, but don't expect it. I have a lot of other crap to take care of that holds higher priority

 

[HackModford]

I am it turns out slightly confused/concerned

why is the design text so large and buttons etc so big?

this is for THE PANDORA RESOLUTION, that is why everything is big and in a small space. It has to be that size or you can hardly see it on the Pandora screen. It is NOT possible to have a bar on both sides like the gp2x file archive, it make it just too small, so they are all on the left for that reason.

So how are we going to use the pandora to browse normal websites? one of the MAIN reasons why I bought it!

I assumed we would be able to use sites that aren't optimised for the pandora? but Craig in effect is saying that a normal web site IE one not designed for PANDORA RESOLUTION can hardly be seen?

Surely the design answer here is you make a NORMAL good looking web site for the Pandora Apps and that the Pandora be capable of being used to look at the normal web site?

If it cant then its not going to be much good for web stuff on the go...or am I missing something?

This was my understanding too. I mean we have the full resolution right? It's just a small screen. This is very sad if it doesn't work as we expected...

 

[Klaus]

No pixelpusher here, so just some ideas for usability:
Top Downloads/New Downloads and stuff like that shouldn't be visible in the sidebar all the time. You want to see that stuff when you first visit the site, but probably not on every app you look into. This should go into the content-area of the start/landing page. The sidebar should feature the categories. Since the pnd-format specifies the categories to be registered freedesktop.org categories, we should use the same categories for the store. As each category has a list of subcategories this could be foldout menus, only the main categories should be visible by default to enhance clarity. For all available categories and subcategories take a look here. Empty categories should not be displayed at all.

In case someone wants to create a standalone app for store, it would be nice if everything could be accessed by SOAP or XML-RPC.

@the people who fear that normal browsing will not be possible with the Pandora:
Shouldn't be a problem at all. Millions of people use 480x320-devices daily to browse the web (Android/iPhone/whatever). But it makes sense to specifically design this site for 800px, just to enhance the experience.

 

[dschroeter]

I slapped together a (barely) functional version with just HTML and CSS here. I've minimally tested it in FF and IE; I'd love to know how it renders on The Device. I'm going for super-simple here; people should remember that rollover effects aren't that important on a touchscreen. Yes, I stole the graphics from greendots. Let me know how it renders on other OSs and browsers!

 

[Klaus]

I slapped together a (barely) functional version with just HTML and CSS here. I've minimally tested it in FF and IE; I'd love to know how it renders on The Device. I'm going for super-simple here; people should remember that rollover effects aren't that important on a touchscreen. Yes, I stole the graphics from greendots. Let me know how it renders on other OSs and browsers!

I like it! Functional, yet appealing. One question though. Why did you set the width on header/contenarea/footer/...? Shouldn't be necessary, as you set the width on page. Effectively you make them wider than 600px because you add padding to them.
P.S.: Clear-divs are much nicer than clear-brs, and HTML 4.01 is sooo out.

 

[Paradox]

love it!!

 

[Near_Kstor]

love it!!

That`s a +2

obs: I like the black version a lot, too... perhaps we could add a little button to switch between both skins?


Edit: Just noticed that this layout doesn't include support for CATEGORIES, which is very bad. Perhaps this could be the secondary window? Being showed AFTER a main screen that provides Categories?

 

[renwils]

I slapped together a (barely) functional version with just HTML and CSS here. I've minimally tested it in FF and IE; I'd love to know how it renders on The Device. I'm going for super-simple here; people should remember that rollover effects aren't that important on a touchscreen. Yes, I stole the graphics from greendots. Let me know how it renders on other OSs and browsers!

I really like this one. Efficient use of real-estate while still being readable. It's hard to judge on an lcd with a different dpi, but the description font might need to be a little larger.

 

[Alec]

I slapped together a (barely) functional version with just HTML and CSS here. I've minimally tested it in FF and IE; I'd love to know how it renders on The Device. I'm going for super-simple here; people should remember that rollover effects aren't that important on a touchscreen. Yes, I stole the graphics from greendots. Let me know how it renders on other OSs and browsers!

Nice! The only suggestion I have is to make the selection mouseover effect extend all the way to the right, and maybe change the "free" box color so that it does not blend with it. Other than that, I like it - simple and functional.

 

[shill]

love it!!

That`s a +2

obs: I like the black version a lot, too... perhaps we could add a little button to switch between both skins?


Edit: Just noticed that this layout doesn't include support for CATEGORIES, which is very bad. Perhaps this could be the secondary window? Being showed AFTER a main screen that provides Categories?

I forgot to change the lower "Most Downloaded (7 days)" to "Categories". Apologies! -.-'

 

[gruso]

I've mashed up some of the ideas from craigix, naw(mcx) and ibrew. It's a photoshop hack only, done without any regard for the coding side of things.

 

[shill]

I've mashed up some of the ideas from craigix, naw(mcx) and ibrew. It's a photoshop hack only, done without any regard for the coding side of things.

image

I could definitely live with this design. Although reducing the size of the text of "Apps, Games, and Emu" area and centering it would make it look better. Just my two cents. One more thing - the updates counter in the bottom right doesn't look right - how about a red triangle in the bottom right hand corner of the box instead?