Replacing OpenEmu's theme

[clobber]

Hey @ThanosSiopoudis -

Clobber from the OpenEmu team here. I'm reaching out because we recently noticed your app. Great that you're tackling the usability of WINE problem, I've typically used Wineskin and PlayOnMac before so I'm very interested in your project and cool that you're using OE code to do so.

Just one problem though- We're gearing up for a 1.0 release finally and we've seen that you've kept the default OpenEmu theme in your app (colors, fonts, etc) and it's well-displayed on your website (http://barrelapp.co.uk).

The problem with this is that it looks exactly like OpenEmu and we plan to have our UI prominently featured on our own website redesign soon.

So I'm asking if you could please change the color scheme in your app and update your website images so it doesn't match OpenEmu's and create any sort of confusion between the two. I see that you have an open issue for a UI redesign (issue https://github.com/ThanosSiopoudis/BarrelApp/issues/7) so I know an overhaul is on your mind.

But for now if you could change this as soon as you can get to it, that would be appreciated! Talked it over a bit with @DMcLeod (designer of our UI/UX) and he could put you in touch with designers that would be interested in helping on your project.

Thanks!

[ThanosSiopoudis]

Hey @clobber, thanks for taking the time to reach out and ask about this, glad you appreciate the effort :)

I sure have a redesign in mind, as you note on Issue #7, I would love to keep the general look and feel of OpenEmu (love the project by the way, great job), and I do understand that it looks exactly the same (because it is!). The big image on my website is basically a placeholder anyway, I intentionally put a blank and rather zoomed out view of the app so it's not clearly visible until someone with UI designing skills would come aboard.

As far as theming goes, though, I am a developer and I can't really put 1+1 together when it comes to designing, photoshop and all that. I'd really appreciate it if you guys can put me in touch with a designer, thanks for that. I'm not sure if I have the skills to re-skin the application by myself, but I can either tone down some images on the website maybe, or replace them with something more generic. I'm not mentioning OpenEmu anywhere on the website either, so search engines wouldn't pick up the keyword.

I'm more than willing to change the way it looks, I never had the intention to "steal" from you guys, I just thought that this would be the kind of UI I'd love to have in an application that can handle Wine. So, sorry about that.

I even considered creating a plugin for OpenEmu to integrate Wine in there, but there are fundamental problems in doing that, which was the reason that I chose to go with a fork of your app.

Thanks, Thanos

[clobber]

Yes this will take a little bit of doing as we do use some png's for custom assets in the UI but you can certainly swap those out with others and at least change some values to get the main window and some modals looking differently. It looks like you spent ~4 months on integrating your WINE support which is quite a feat so I think you could probably get away with swapping colors.

background_lighting.png is a good start as it's the giant graphic in the game library view.

I'd also go through the stuff in Interface Graphics folder, check Theme.plist and maybe search the app for any [NSColor colorWith

As an joke, I once partially reskinned the main window with an ugly Pokemon theme and only had to change a couple pngs and some values for the sidebar, so this is possible.

Edit: if one was desperate enough, they could even open up all the graphics in photoshop, click 'invert colors' and save as a quick palette swap.

[ThanosSiopoudis]

Love the pokemon theme! :)

I've removed the big image for now, and I'll try and come up with something soon. I'll keep you posted.

[DMcLeod]

Hey David here.

So, what I would propose is a first pass at 're-skinning' the app. As clobber mentioned this means swapping out the image resources in the application (.pngs, .jpgs etc) as well as tweaking plists and other places that handle styling and color as mentioned previously.

What I can also do, is try and get a willing designer friend to maybe help you out with that.

Now, I am not that familiar with WINE and never actually tried getting a game to run through it. What I do see is the user flow of the application perhaps needing some work and some changes to library management (I could be wrong without doing the research).

Looking at the functionality you need the following core UI/UX...

• Import / Compile Wizard: The ability for the user to click 'Add New Game', up slides an Import Wizard taking the user through some steps to get the game in the library. Step 1 is to drag n drop a .exe onto, the window. Step 2 is to select the resources to 'compile' with a 'start' button which has a progress bar. Step 3: is to show them the game added to their library by taking them back to the library view.
• Library View: I don't think you actually need a sidebar for your application. You just need one 'library view' listing all the games. I would place some of your genre stuff (which you have labelled as 'Library') in the toolbar at the bottom. I wouldn't have a 'collections' mechanism as a v1 until you analyze your users usage of the app.

So, the Import Wizard involves some specific UI/UX to better suit the use case of your app. Library View is global, and the application just needs to be re-skinned with the elements already included and use them to focus in on the core functionality of the application (essentially visual design with IA thinking). I think a good designer could do a pretty decent tasteful riff on the on the UI that makes it look a lot different than OpenEmu but has its ethos at heart. If it were me, I'd be tempted to see if I could riff off of the old beige boxes back in the day, have a kind of 'white' UI with some beige elements and contrasting going on. Thats up to you and the designer of course.

Let me know and I'll point some people to this GitHub discussion and things can move from there. (assuming I find an interested guy).

[ThanosSiopoudis]

Hey @DMcLeod, Thanks for all the great suggestions. Allow me to explain a few things on how this app works. As you said there is the import wizard which allows you to add a new game to the library. This is really broken in two ways of importing.

1. Import with a "recipe", where the game is imported using a recipe found on the server. A recipe is really an XML file with instructions for Barrel , on how to install the game.
2. A manual import, where a recipe can't be found and the user can be taken through a step by step wizard in order to try and successfully import a game by requesting for some feedback from the user.

No compiling needs to take place, all engines are downloaded as bundles from the server and they are completely interchangeable. So it's just a matter of fetching all needed files and then running the game's installer.

Now the result of this import is an .app bundle for each game, with an entry in Barrel. You can even take these bundles outside the Library folder and they'll continue to function properly as standalone apps! That creates the need for another UI for these apps, so they can be configurable in case they live outside a library. That interface should be much more simple than Barrel's, though, as it is only going to serve the purpose of configuring a few properties for wine, like the executable launch path, or a link to launch Wine's registry editor.

Now for the library view I agree 100% to what you suggest, but I do think that the collections feature is something that is much needed for people using Wine. There are so many use cases, and makes organising so much easier, which is basically the main feature of the Library.

There are more features that I have planned for the future, but I hope we'll manage to find someone to help until I implement them!

Thanks again to both for your kind help on this, much appreciated. As I said earlier I've already removed the big MacBook image with the plain library view from the website until I create something that doesn't hurt your eyes too much!

P.S. If you need any help on building your website redesign I'd be glad to lend a hand.

P.P.S: Something quick I'm coming up with:

[ThanosSiopoudis]

Ok, so I just finished the whole re-skinning on the new colour set, I hope it will do for now, let me know.

[clobber]

Yeah I think you did a pretty good job with the quick reskin. I actually like the colors - nice job!

[ThanosSiopoudis]

That wouldn't really be possible if it weren't for the great skinning you guys did in OpenEmu, I found it much easier than I'd thought it would be and the result looks alright I think.

Great, glad you like it. I'll change the images on the website too soon, so there is no confusion with OpenEmu and your release.

[ThanosSiopoudis]

The website content has been replaced, I'm closing this Issue for now. If you guys can find a designer who's interested to join the project, please reply here and I'll reopen the case.

Thanks

[DMcLeod]

I'll point some people here. See how it goes. :)

[DMcLeod]

Gordon Irving is interested in helping you out. I'll try and connect you two. Do you have an email address or a good way for him to contact you?

More on Gordon: http://www.gordonirvingdesign.com/Gordon_Irving___Design/Home.html

Consider that he will need to get a good understanding of the functionality of the application and abstract himself away from the current UI in place. (Getting used to how you add games manually or with recipes etc, asking you a ton of questions) Then he will want to look at the UI/UX and fit it to the functionality of the application before styling the app to fit.

That would be my recommendation, with of course, talking a lot with you throughout the whole process.

[ThanosSiopoudis]

That's great, thanks! If he can send me an email at siopoudis@me.com that'd be fantastic. I'll be glad to answer to any questions he may have and try to explain everything as good as I can, and listen to any ideas or proposals he may have.

Thanks a lot for your help again, David, I really appreciate it.

[DMcLeod]

No worries, I've passed on your email address to him and he should be in touch soon. If you need someone to offer impartial advice on UI/UX approach or just general consultation then let me know. Happy to do that.