search

owncloud / android

:phone: The ownCloud Android App
GNU General Public License v2.0
3.81k stars 3.05k forks source link

Intro Help guide, new wizard to guide the user through the app features #1104

Closed supportreq closed 6 years ago

supportreq commented 9 years ago

With the Material Design almost in place, we should really have an intro screen which introduces the features of our OwnCloud App something what dropbox or box or even Google Drive does..

@AndyScherzinger what are your thoughts??

TASKS

AndyScherzinger commented 9 years ago

Do you mean like a dialog with a view pager on the very first time start up the app?

supportreq commented 9 years ago

yes

supportreq commented 9 years ago

I just checked the iOS app has it.. @rperezb can we have it in android as well

AndyScherzinger commented 9 years ago

Can someone provide some screenshots from the iOS app, to get a better picture of how this is intended to work and what kind of information should be shown?

supportreq commented 9 years ago

I will it to you in sometime

supportreq commented 9 years ago

It's an amazing animation where the owncloud logo shifts from one screen to another as an animation..

image1 image2 image3 image4 image5 image6

AndyScherzinger commented 9 years ago

Nice! Are the corresponding image resources available somewhere?

AndyScherzinger commented 9 years ago

iOS files for this can be found here: https://github.com/owncloud/ios/tree/develop/Owncloud%20iOs%20Client/SupportingFiles/Images/HelpGuide

tobiasKaminsky commented 9 years ago

This should occur on the very first time or everytime an account should be added? (preferring the first one: only on first installation)

AndyScherzinger commented 9 years ago

I would also pledge for one time only on very first launch of the app and also for no animations except the sliding itself

rperezb commented 9 years ago

Hey guides, on iOS we call it the help guide, this is shown the very first time the app is open (not per account basis)

I rename this issue to help guide

The splash screen is shown everytime the app is open and it´s an static image, the one used on iOS is: https://github.com/owncloud/ios/blob/develop/Owncloud%20iOs%20Client/SupportingFiles/Images/ImageBranding/Branding/Default-Portrait%402x~ipad.png

supportreq commented 8 years ago

@AndyScherzinger @tobiasKaminsky in case you guys can implement this will be awesome!!

tobiasKaminsky commented 8 years ago

We first need the approval of @jancborchardt @masensio or @davivel

jancborchardt commented 8 years ago

Yes, however this should be condensed down to fewer steps. 6 steps is too much and will annoy people on first startup. @nasli @rperezb where is the related iOS issue?

rperezb commented 8 years ago

@jancborchardt on iOS there are 6 slides too, @supportreq pasted them https://github.com/owncloud/android/issues/1104#issuecomment-133315788

jancborchardt commented 8 years ago

@rperezb I know, however I said in a past issue that 6 are too many. I can’t remember now which, that’s why I’m asking @nasli if she remembers where I said that.

nasli commented 8 years ago

@jancborchardt, here it is owncloud/ios#404 and also related on desktop owncloud/client#3711

We added a skip button as you suggested if someone does not want to see the slides, and we agreed to keep the 6 slides.

But, take the advantage now that has not yet started development and redesign it with any improvement ;)

supportreq commented 8 years ago

@tobiasKaminsky you working on this?

tobiasKaminsky commented 8 years ago

No. The artwork and what the images should display is something I cannot do very well, so this should be up to @jancborchardt. When the images are ready @AndyScherzinger @LukeOwncloud @przybylski or me can do the intro slideshow.

AndyScherzinger commented 8 years ago

I think the images are already there, see link to the ios repo. Imho we would need them in the different resolutions or at least in xxhdp since scaling down isn't so bad as having Android scaling up... Support it in the native resolution for all the sizes is probably a bad idea since it will at a lot ob KBs to the APK.

Besides that we would also need a video to have an idea about the animation that is mention (we I would probably drop for Android....)

And also a general design thing @jancborchardt the intro guide uses the pre oC 8.2 file type icons thus the intro screen images should get a refresh :grin:

supportreq commented 8 years ago

@AndyScherzinger @tobiasKaminsky I can help with the images.. please advice the resolution, and the points that need to be covered..

przybylski commented 8 years ago

Today in the morning, i put together something super super super super super super super hacky to get some initial look and feel, this is what i did: https://drive.google.com/file/d/0B--v4KNhT4mVSThJcFV2WUVqeHc/view?usp=sharing

nasli commented 8 years ago

@przybylski look nice! Better in an ownCloud Server ;)

We will start including all the resources in svg files into the iOS project within new release.

Until then, you can get it from here https://s3.owncloud.com/owncloud/index.php/s/KCaxDdBUxG91bau

The IntroGuide.svg file includes all icons organized in separete layers for an easy way to edit them, I use Inskcape to create it, enjoy!

supportreq commented 8 years ago

@przybylski check https://github.com/federicoiosue/Omni-Notes intro guide.. it is simple but looks very powerful.. and it's parent library : https://github.com/PaoloRotolo/AppIntro

przybylski commented 8 years ago

very interesting, I wonder what will @jancborchardt say

supportreq commented 8 years ago

Check the demo app they have some amazing design : https://play.google.com/store/apps/details?id=paolorotolo.github.com.appintroexample

AndyScherzinger commented 8 years ago

Well, this depends on several things:

Don't get me wrong on the lib, the example sure does look nice, but from a technical pov I would leave that.

AndyScherzinger commented 8 years ago

@nasli are you updating the intro graphics to incorporate the latest icon designs? :tada:

tobiasKaminsky commented 8 years ago

I would suggest to not only show the basic options of the owncloud app (as they are expected), but also go more into detail and show the newest features (once they are merged):

przybylski commented 8 years ago

Maybe showing new and significant features in a popup after upgrade? something like:

Did you know that now you can do A B and C?

Announcing bug fixes isn't appealing (at least not to me)

tobiasKaminsky commented 8 years ago

No, no bug fixes. This is just annoying. I just thought that we can reuse this feature to not duplicate the work in order to show new features.

supportreq commented 8 years ago

@AndyScherzinger I agree dependencies will increase, with the issues being merged it should not be a tedious effort. Also @tobiasKaminsky agree we should show the new features, big ones like material design, FAB icons.. with a basic intro to the app like dropbox..

tobiasKaminsky commented 8 years ago

@przybylski So you are working on the technical implementation of this? :+1: @jancborchardt We now need a decision on what should be on 6 slides. (Also we should keep in mind that (if we want to introduce new features) this needs to be changed every release, which means extra work.)

My idea is to show 6 initial basic functions if the app is started for the very first time (of course with a skip button). On every release there is a "what's new?" slide with 2-3 new features.

przybylski commented 8 years ago

@tobiasKaminsky technical implementation is easy. I would really like @jancborchardt to specify at least minimal design (I do have an idea but I rather let professional to handle it ;) ) As for changes on every release I do have a plan how to ease the pain of changes :)

tobiasKaminsky commented 8 years ago

This is great :) Then we let this all up to you and @jancborchardt You are really a very big help :) Wish you were never gone ;)

MTRichards commented 8 years ago

@przybylski Welcome back!

przybylski commented 8 years ago

I haven't got too much time this week to work on this but current progress looks like this (texts and images are dummy, I would need some resource for android).

On first run:

zrzut ekranu 2015-11-26 o 14 41 56 zrzut ekranu 2015-11-26 o 14 42 19

On upgrade:

zrzut ekranu 2015-11-26 o 15 04 34

Forward and tick icon are taken from android so they probably don't match overall design.

From programmer standpoint adding screen is (almost) single line. You need to specify string resource id for title and description of feature and resource id to image (all of them are optional). And version in witch feature was introduced (in string form like "1.8.1") everything else would be shown automatically.

Eg: new FeatureItem(R.drawable.logo, R.string.welcome_feature_1_title, R.string.welcome_feature_1_text, "1.0.0", true) One thing to mention is that "Welcome to ownCloud" screen will be shown after this feature is introduced even on users who already have ownCloud installed.

przybylski commented 8 years ago

Code is ugly but accessible on branch https://github.com/owncloud/android/tree/whatsNew

AndyScherzinger commented 8 years ago

I can probably add the icon work needed and have a look at the code. As for the background color I think @jancborchardt wanted us to move to #ffffff to have the same colors used by the web and the mobile apps.

przybylski commented 8 years ago

First I wanted to cleanup code a bit, any feedback from UX perspective will be valuable

AndyScherzinger commented 8 years ago

Is it okay for you to have other community devs committing changes to the branch or should we just provide any feedback in the issue?

przybylski commented 8 years ago

Commit, I have no objections.

But shouldn't #ffffff coloring be fixed across whole application instead of single activities? I changed background to #ffffff here's preview:

zrzut ekranu 2015-11-26 o 17 08 41
AndyScherzinger commented 8 years ago

It should, yes. I did that on a branch including a PR but this hasn't been merged to master yet.

tobiasKaminsky commented 8 years ago

Shouldn't the "skip" look like a button? Currently "skip" and "next" look a bit lost there...

@przybylski Great work. Looking forward to have it in beta branch.

One thing to mention is that "Welcome to ownCloud" screen will be shown after this feature is introduced even on users who already have ownCloud installed.

Why is this so? You could check for an existing account to distinguish between "update" or "new install", or?

przybylski commented 8 years ago

I was aiming for skip and next not look like a button, they are borderless, so they look more like integral part of activity.

You could check for an existing account to distinguish between "update" or "new install", or?

That is actually a good idea :) in addition to the current mechanism. Now it's currently storing a version code in a preference which indicate last version, when this changes, list of new features, if there are any, is shown.

The whole idea is to show "Welcome to ownCloud!" once upon install, and every "What's new in ownCloud" only after upgrade.

tobiasKaminsky commented 8 years ago

it was just a minor idea, and I am not a UI expert, so I am fine with the borderless "buttons".

The whole idea is to show "Welcome to ownCloud!" once upon install, and every "What's new in ownCloud" only after upgrade.

This is very good :+1: Will this also work with beta version?

przybylski commented 8 years ago

It depends, what is the versioning with beta looks like?

tobiasKaminsky commented 8 years ago

20151126, 20151127, and so on

tobiasKaminsky commented 8 years ago

I have checked out your branch and tried it. It really looks great! But, is it possible to use swipe left/right to change between the screens? At least this was what I tried and I guess this is the most common way users try to use it.

tobiasKaminsky commented 8 years ago

Regarding the version number. I saw that you use eg. 1.8.0. Maybe it is better to use the versionCode as in AndroidManifest: 10800000. With that the beta version would work out of the box (as it is the same length: 20151125)