GSoC 2016

[Menaka mohan]

Hello everyone!

I am Menaka M (F), undergraduate computer science engineering student from India. I speak Tamil(native), English and Telugu.
I have a good experience in PHP, JavaScript and HTML/CSS (UI/UX skills). I worked on a few university level projects using the above mentioned technologies.

Under GSoC 2016, I am very much interested in developing a "mobile-friendly user interface for tatoeba.org". Having said that, I went through the discussion threads and got a rough overview of challenges that we may face in the course of development. I wish to share my opinions on the same. (I request the mentors to kindly correct me, if i am wrong.)

1. For me, creating a separate website for mobiles is more appealing. (Though i may contradict Sushmita's last reply to Trang Ho on this topic on 2/15/15)
2. As Trang Ho suggested we shall progressively add the features into the mobile site from the user recommendations and inputs.
1. To decide on what features to give more importance to and what subtle features to be hidden, why don't we take the help of Google Analytics reports ?
2. We shall concentrate on the most used screen size from the report and design the site accordingly with all the features it can accommodate in that particular size.
   
3. Then with the change of screen sizes, we shall use our ranking on site features  and dynamically add in or hide those features.
4. Our goal will be to NOT disappoint any user at any point of usage.
3. As Tomasz melcer pointed out, I too see this task as having two sub tasks. Programming and UI design. (Both are equally important in terms of user experience)
   
1. Kindly help me in analyzing and differentiating the important and subtle features. I will spend more time on that and update my progress regularly.
2. Then, we shall complete the design part of our project before the coding period of GSoC. (Let the Art be done first :) )
   
3. Then we may progressively add things and make changes within the 2.5 months of time.
4. I understand the difficulty of this project. But considering the rise in mobile traffic, we should start this asap.

I have also read your previous posts on selecting students for this GSoC more carefully. So, kindly assign me some tasks related to this project and i will try my level best to prove my skills and add some value to this project before i could submit my proposal.

I followed the instructions on tatoeba/imouto to set my dev environment. I am facing few issues which i will try to solve with the help of your previous posts. Or-else i may need your help.

Regards,

Menaka M.

[Trang HO]

Hello Menaka,

Welcome :) and thanks for your interest.

The mobile friendly UI project is indeed a quite difficult one but it's one of the more "mature" ideas in the project lists (at least for me). And I agree with you that with the rise of mobile traffic, it's becoming a more and more urgent topic.

For me, creating a separate website for mobiles is more appealing.

Unless you tell me that you have developed a mobile website before, I wouldn't consider going this route at all. It would be a higher risk project. At this point however I cannot really judge yet, I don't know you enough. So don't give up on this idea yet.

To decide on what features to give more importance to and what subtle features to be hidden, why don't we take the help of Google Analytics reports ?

It doesn't only depend on Google Analytics. Some parts of Tatoeba are easier to revamp, some parts are much harder and require very high level skills.
I'd rather we work on something that is "low priority" from an analytics point of view, but for which we can achieve a good result, rather than work on something "high priority" but we completely fail at it because we're clearly lacking skills.

We shall concentrate on the most used screen size from the report and design the site accordingly with all the features it can accommodate in that particular size.

If you're wondering, I took a quick look, here's the top 10 screen sizes (data taken between January 28 and February 27): http://prntscr.com/a938ml

Kindly help me in analyzing and differentiating the important and subtle features.

I think this is something you will have to experience by yourself, by using Tatoeba. The importance of a feature is relative. Everything can be important. It depends what matters more to you.

Since you want to work on the mobile-friendly UI idea, I'd suggest you try to use Tatoeba from a smartphone, and figure out what parts of the website frustrate you the most.

I have also read your previous posts on selecting students for this GSoC more carefully. So, kindly assign me some tasks related to this project and i will try my level best to prove my skills and add some value to this project before i could submit my proposal.

Here's a rather simple issue you could start with: https://github.com/Tatoeba/tatoeba2/issues/993.
Please let me know your GitHub username, and also read our guidelines for pull requests:
https://github.com/Tatoeba/tatoeba2/wiki/Guidelines-for-submitting-pull-requests

I followed the instructions on tatoeba/imouto to set my dev environment. I am facing few issues which i will try to solve with the help of your previous posts. Or-else i may need your help.

Please don't hesitate to come to our IRC channel and ask for help.


See you around!

Trang

--
You received this message because you are subscribed to the Google Groups "tatoeba" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tatoebaprojec...@googlegroups.com.
To post to this group, send email to tatoeba...@googlegroups.com.
Visit this group at https://groups.google.com/group/tatoebaproject.
To view this discussion on the web visit https://groups.google.com/d/msgid/tatoebaproject/a9be5755-c9e5-47a9-b740-9a782f18043e%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[CK @ Tatoeba Project]

I agree with Trang that having a separate mobile site is not the right approach. It would be much better to go with something similar to the way Bootstrap handles this.

Trang apparently doesn't want to use Bootstrap, but if you look at Bootstrap, you could probably get a lot of good ideas.

== 

== CK @ The Tatoeba Project

==

To view this discussion on the web visit https://groups.google.com/d/msgid/tatoebaproject/CABa8KUTKhA_JJ34kk2jPKOtMJFxmsqWJH7PsWtH-3GSQ15noLQ%40mail.gmail.com.

[CK @ Tatoeba Project]

Another very good web design to look at for inspiration is this one.

https://www.washingtonpost.com/

Resize the window to see how it handles different size screens.

Click the menu icon on the top right.  Notice how the menu has secondary menus for large screens, but also works well on narrow screens.

[CK @ Tatoeba Project]

Sorry, instead of "menu on the top right", I meant the "sections" menu on the top left.

https://www.washingtonpost.com/

== 

== CK @ The Tatoeba Project

==

[Trang HO]

​Trang apparently doesn't want to use Bootstrap​

​Just for clarification. It's not that I don't want to use Bootstrap. Bootstrap is not the only solution.

​If we have analyzed various solutions, and we can justify why Bootstrap over these other solutions, then I have no problem using Bootstrap.

[Tomasz Melcer]

I've recently had a small project in Foundation [1], and while it less
known and has somewhat less different types of UI elements compared to
Bootstrap, I really liked its nice built-in support for responsive
interface.

And Foundation is not the only alternative.

[1] http://foundation.zurb.com/


--
Tomasz Melcer

[Menaka mohan]

Hello Trang,

Firstly, thanks for your inputs. The more challenge you pose, the more i tend to work.

Unless you tell me that you have developed a mobile website before, I wouldn't consider going this route at all.

I have worked on a two-cross platform mobile application using Apache-cordova. One of them won a prize from Microsoft for the idea and design. So i have a little experience in responsive web design and development. I am not an expert in this area, but willing to learn and work more.

I'd rather we work on something that is "low priority" from an analytics point of view, but for which we can achieve a good result, rather than work on something "high priority" but we completely fail at it because we're clearly lacking skills.

Yes sir, I totally agree. After doing some more research on your site, i feel this would be the best strategy.

here's the top 10 screen sizes

I checked the site in the top screen sizes using the tool in the browser and felt the importance of this project. I prefer to start working on this asap, well before GSoC.

I think this is something you will have to experience by yourself, by using Tatoeba. The importance of a feature is relative. Everything can be important. It depends what matters more to you.

 

 I am currently working on the same. Will need some more time to look into all little features and discuss the same with you. I also looked into the issues in GitHub, which may add in/change the features of the site and need to decide accordingly. Please give me more time to work on this area.

My GitHub user name is /menakamohan. I am new to FOSS. I have a decent experience only in university level projects. I contributed to only one OpenSource project (http://tux4me.azurewebsites.net/) so far. I hope this may not stop me from showing interest in your "big" project. I will put in my best efforts.

Regards,
Menaka.

[Menaka mohan]

Hello CK,

Thanks for your inputs.

I agree with Trang that having a separate mobile site is not the right approach.

Please correct me, if i am wrong. Building a new responsive site (Which will/should work both on mobiles and laptops (all screen sizes)) will be our goal. We shall progressively achieve that point. It may not be possible in two months of GSoC time. I should start working much earlier to get a working site by the end of August.

but if you look at Bootstrap, you could probably get a lot of good ideas.

Bootstrap will be one among the best options as we have too many examples and good documentations available. We shall also look into other frameworks and take a collective decision.

As Tomasz Melcer said, Foundation may be a good option. I haven't worked using that. I'll look into that.

Out of curiosity i have also tried to drop some web components (https://www.polymer-project.org/1.0/) into a little CakePHP codebase. I worked great.

So following the material design by Google for UI design and using Polymer project may also be a good option. We have ready-made elements (https://elements.polymer-project.org/) and a good documentation for the same.

[Menaka mohan]

Hello again,

Using polymer may also give the Android users a better experience with its material design. But to be cautious, Polymer is still evolving.
An example for Polymer together with little bootstrapping may be https://inpay.pl/register/ . We shall further analyze and take a decision.

Regards,
Menaka.

On Sunday, February 28, 2016 at 7:35:16 PM UTC+5:30, Menaka mohan wrote:

[Trang HO]

​Hello Menaka,

Well, as you know we were not accepted for GSoC 2016 but I'll answer briefly to one of your points:

> So following the material design by Google for UI design and using Polymer project may also be a good option.

I was actually reading/experimenting a bit with Material Design up a couple of months ago and it looked quite promising to me.
I haven't looked at all into Polymer though. It still feels a bit too early stage, but maybe I just have the wrong impression. It would certainly be interesting to prototype a few things with it.
I personally only tried Angular Material (based on AngularJS) but I'd like to also try out Material UI (based on React.js).
This is by the way a prototype I did with Angular Material: http://codepen.io/anon/pen/obaRVQ. The SVG icons don't work in codepen but it's just to give you an idea. It was an attempt to re-design the sentences block with Material Design.

Anyway, you've said in the other thread that you are still interested to contribute to Tatoeba during your spare time, and I'm happy to hear that. I have therefore sent you an invitation to our GitHub team. Obviously you should focus on finding another org for GSoC, and I wish you good luck, but I hope to see you around sometimes on IRC or on GitHub. I will make sure to let you know if/when we are organizing a Tatoeba coding event.

Trang