πŸ“œ ⬆️ ⬇️

"Tutor: Mathematics" to prepare for the exam and CDF - from idea to release. A story about a unique educational project


Content


opening speech
How did it all start?
- The origin of the idea and objectives
- A few words about our team
How to translate into digital format what a professional tutor does?
- The main ideas of the application
- How to provide an individual approach to each user?
Thinking through the main elements of the project
- Application design and its flow chart
- Back-end design (application creation and management systems)
- In what sequence to do everything?
Content Creation
- Author's content
- Transfer of copyright content to the system for creating and managing resources
Development of IT solutions
- Development of the back end
- Development of front-end
- Design development
Difficulties before release
- Purchase functionality
- unity of design
- Application logo
Release
Further plans for the development of the project: what are we doing now?
- Functional expert support
- Chat
- Cross - platform purchase
affiliate program
Blog for students and their parents, teachers and tutors and other content
Epilogue



opening speech


Already more than a year ago, in December 2016, we began to think through the idea of ​​the application β€œ Tutor: Mathematics ” , which would allow any schoolchild independently, simply and effectively to prepare for exams that they would meet in his life. At the same time, we wanted our application to be also useful for teachers , tutors and parents , being for them a kind of β€œ ready-made rails ” for working with children.


')
The most relevant exam in the life of any student - a kind of culmination of just 11 years of study - is the Unified State Exam , known to all by the acronym EGE. Preparing for it is difficult and thorny, especially considering that in the modern realities of our education, not every school teacher can prepare his students for taking this exam for the maximum score.

Another turning point in the schoolchild's life is the transition from the 4th to the 5th grade (from primary school to basic secondary), accompanied by the surrender of the All-Russian Verification Work (CDF), which is analogous to the USE in form, but it also contains interesting and unusual tasks that test the ability to think with a high degree of independence, to which the modern school, unfortunately, does not always prepare all. At present, an elementary school program is basically a system of simple, well-algorithmized tasks that are solved by analogy with ready-made, repeatedly tested samples and do not require great intellectual independence. And in carrying out certain tasks, the WRD will need to show freedom and flexibility of thinking.

Life is so decreed that our team, in which the idea of ​​this project originated, consists, in fact, entirely of people who have a direct relationship with mathematics and school. Therefore, it was natural for us to do first of all the project, the specifics and content of which we understand quite well, namely, we made the application β€œ Tutor: Mathematics ” to prepare for the Unified State Exam (basic and profile levels) and CDF (grade 4) ( website About the app , web version , App Store (iOS), Google Play (Android)).

For more than a year we went from idea to release of this project, this article is devoted to opening a whole series of articles for Habrahabr, in which we will talk about many interesting things, problems and their solutions, difficulties we have encountered and continue to face in our work.

How did it all start?


The origin of the idea and objectives


For several years now, my friends from Trinity Digital have been working closely on solving problems for the Balass publishing house, which specializes in educational literature for schools.

Therefore, when we had the idea to create a project of an electronic tutor, we turned to a publishing house, and it, fortunately, believed in our idea and agreed to invest in the creation of this project.

The task to be solved consisted of several completely different subtasks. It was necessary:


The solution of each of these fundamental problems required an integrated approach and, as a result, the creation of a unique team of teachers, mathematicians and IT developers.

A few words about our team.


We would like, of course, to mention and describe the contribution to the project of each of our employees, but there are already more than 20 of them, so in this article we will only talk about the authors of the idea and the leading developers.



The person whose ideas formed the basis of the β€œTutor” is widely known to a large number of mathematicians β€” the content director of the project β€” Alexander G. Rubin β€” a tutor with more than 40 years of experience, an associate professor at the Moscow State University of Fine Chemical Technologies. MV Lomonosov, and then Moscow Technological University, teacher of Moscow schools - β„–179 at MIOO and Physics School β„–2007, candidate of technical sciences, author of school textbooks in mathematics. It was his ideas that formed the basis of the project, how the application logic should work, how the application should guide the student and help the teacher or parents.



Together with A. G. Rubin, Svetlana Aleksandrovna Kozlova , the author of preschool and school mathematics programs, textbooks and aids, helped us to work on the pedagogical concept of the application. Being a specialist in teaching mathematics to children in elementary school and preschoolers, she brought into the project a multitude of ideas and forms of tasks that are necessary for our young users.



Vsevolod Chuprygin and Faris Nasybulin , two amazing specialists who worked with us, starting with the project of creating an electronic form of textbooks for the Balass publishing house, were engaged in developing the back-end of the application.



The main developers of front-end versions are Ekaterina Kolesnikova (iOS), Oksana Pokrovskaya (Android) and Andrey Makarov (Web). Thanks to their great skill and attention to detail, we were able to make applications for the App Store, Google Play and the web version as user-friendly as possible, neat and fast.



Of course, the visual soul of the application and how it is perceived at first glance, as well as how everything should look, requires expert insight and deep understanding. We are very pleased that our art director Roman Golyshkov and our amazing illustrator who helped us create unique images: awards, icons, etc. Zarechny Timur helped us with this project.



Lead this project lucky the author of this article. My name is Osipov Roman , for the past few years I have been leading the development of all IT solutions and products of the Balass publishing house, and for many years now I have been closely associated with the technologies of Wolfram Research, which we have used closely within this project (I’m still I will tell below).

How to translate into digital format what a professional tutor does?


The main ideas of the application


We have set ourselves a rather ambitious task - to make an application that will enable the user to learn as much as possible independently, to help him prepare for a high-level mathematics exam, and not to train . We also wanted the application not to be, in fact, the same paper textbook. Unfortunately, this is what most of the solutions available on the market look like.

We started with multiple long meetings with content authors and content director. We found out the small details of how they build the child’s education, what they pay attention to, how they choose the topics of the classes and monitor the current success.

During the discussion, we concluded that in preparation for the exam, we needed to divide all the content into three parts, which we gave the internal name β€œ content detail levels ”:


We also developed a set of basic rules that all content and interface of applications follow:


How to provide an individual approach to each user?


Just above, we already mentioned the β€œ content graph ”. This is a very interesting idea, which at first glance may seem simple, but in fact it hides the most important distinguishing feature of our application, namely, that it is able to provide each user with the formation of an individual learning path based on the feedback that he does in the application what and how he decides.

Content graph consists of two types of vertices:

  1. tops-tasks;
  2. card-tops.

The first type of vertices is the usual tasks that the student solves. Each task belongs to a certain card (in the previous paragraph we discussed that the card is generally a theory along with the training ). In addition, each task carries a recommendation to the user . Simply put, if the user cannot cope with this test task, then the user receives a recommendation for further work. If coping - moves on.

Since each task is associated with a card, in the system we get the interconnection of absolutely all interface elements, all content units into a single network .

Thus, each user travels along this graph of the theory along its own trajectory, which can begin at any of its vertices . He can at any time "jump" independently from the top to the top and move on. "Tutor: Mathematics" is thus a kind of conductor who advises possible directions, and if the user follows them, the application will make it go through all the content, while at the level of detail (depth) that is needed by him .

The figure below shows a fragment of this graph (subgraph) - how several vertices are connected:



This whole complex system is presented to the user as simple recommendations after solving any problem in the application.



Thinking through the main elements of the project


Application design and flow chart


What is for the application developer (both the back-end and the front-end) one of the most important elements is the so-called flow chart of the application. Simply put, this is a block diagram with different screen states and transitions between them. According to this scheme, it becomes clear that what should follow in the application, and what is connected with each other.

Of course, the development of the first flow chart is very difficult. This requires a detailed description of the application and a sketch of the scheme from which the designer is already creating a ready flow chart. After that, it remains only if necessary to make changes to it.




Back-end design (application creation and management systems)


Of course, the development of a system for creating and managing resources relies on the flow chart of an application, but generally speaking, since only members of our team work with this system, we are engaged in external beauty here last, leaving it for later.

The development of this system is in some sense (ideologically) simpler, since it is a structured storage of resources with the function of full-fledged management of them. Experts working with it are a priori specialists, which means that from the point of view of usability of the interface (at first, for sure), many things are secondary.

However, this system has many of its difficulties. To make it complete, it took a huge amount of effort and a special kind of interface:


In addition, we have developed many other specialized interfaces for:


And, of course, much more.

In what sequence to do everything?


Of course, any project has a time and financial framework. And you never get to do a project and solve various tasks in it consistently. You always have to sacrifice something so that the work does not stand still, come up with workarounds.

Since we already have experience in developing content applications (and they have their own serious specificity), we decided to act according to the approach that we have already developed in many ways:


This scheme certainly creates a lot of inconvenience in the work, requires some retraining of employees working with content, but in general it saves a lot of time. Thanks to her, we were able to make our application several months faster.

Content Creation


, - , , , .



. . . . . :


, , - . , , - , , .


, , ( ) MS Word, . - (Google Sheets), IT- .

, , . .


. , , . , , .





«» . () Wolfram Language .


trigonometricCircle Wolfram Language
trigonometricCircle[{aMin_, aMax_}, {vertical_List, horizontal_List}, points_List, OptionsPattern[{"Prolog" -> {}, "Epilog" -> {}, "DegreeQ" -> False}]] := rasterize[Graphics[ {OptionValue["Prolog"], GrayLevel[0.5], AbsoluteThickness[2], Circle[{0, 0}, 1], AbsoluteThickness[4], rColors[1], Circle[{0, 0}, 1, Sort@{aMin, aMax}], If[Abs[aMax - aMin] > 2 Pi, {rColors[3], AbsoluteThickness[2], Arrow[(0.25 + 0.5 1/201 Range[1, 201])* Table[{Cos[ang], Sin[ang]}, {ang, Min[{aMin, aMax}], Max[{aMin, aMax}], Abs[aMin - aMax]/200.}]]}, Nothing], {GrayLevel[0.5], {Dashed, AbsoluteThickness[3], InfiniteLine[{{#, 0}, {#, 1}}]}, Text[Framed[Style[#, FontFamily -> $font, 20, GrayLevel[0.2]], Background -> Opacity[1, White], RoundingRadius -> 10, FrameStyle -> Directive[AbsoluteThickness[2]]], {#, 1.7}, Scaled[{1/2, 1/2}]]} & /@ vertical, {GrayLevel[0.5], {Dashed, AbsoluteThickness[2], InfiniteLine[{{0, #}, {1, #}}]}, Text[Framed[Style[#, FontFamily -> $font, 20, GrayLevel[0.2]], Background -> Opacity[1, White], RoundingRadius -> 10, FrameStyle -> Directive[AbsoluteThickness[4]]], {-1.75, #}, Scaled[{1/2, 1/2}]]} & /@ horizontal, {AbsoluteThickness[4], rColors[2], Line[{{0, 0}, 1.2 {Cos[#], Sin[#]}}], rColors[2], AbsolutePointSize[14], Point[{Cos[#], Sin[#]}], Text[Framed[ Style[If[OptionValue["DegreeQ"], #*180/Pi Degree, #], FontFamily -> $font, 20, GrayLevel[0.2]], Background -> Opacity[1, White], RoundingRadius -> 10, FrameStyle -> Directive[AbsoluteThickness[4]]], 1.3 {Cos[#], Sin[#]}, Scaled[{1/2, 1/2}]]} & /@ points, {GrayLevel[0.2], AbsolutePointSize[8], Point[{Cos[#], Sin[#]}]} & /@ {0, Pi/2}, Text[Style[1, FontFamily -> $font, 20, GrayLevel[0.2]], {1, 0}, Scaled[{-1, 1.2}]], Text[Style[1, FontFamily -> $font, 20, GrayLevel[0.2]], {0, 1}, Scaled[{-1, -0.2}]], OptionValue["Epilog"] }, Ticks -> None, PlotRange -> {{-2, 1.6}, {-1.5, 2}}, AspectRatio -> 1, Axes -> True, AxesStyle -> {{GrayLevel[0.3], AbsoluteThickness[3], Arrowheads[{0, 0.04}]}, {GrayLevel[0.3], AbsoluteThickness[3], Arrowheads[{0, 0.04}]}}, AxesLabel -> Map[Style[#, Directive[FontFamily -> $font, 25]] &, {"x", "y"}], GridLines -> None, GridLinesStyle -> LightGray, Background -> White, ImageSize -> 800, PlotRangePadding -> 0, PlotRangeClipping -> False, ImagePadding -> Full, Method -> {"AxesInFront" -> False}], 800, 50] 


, ( , ( ), ):



IT-


, ( ) , ( 30.000.000 ).

. " - " " - ".

- , β€” β€” , , , - - (, ). , , . , API, , , , , . , .

- β€” β€” iOS (App Store), Android (Google Play) Web ().

- - (, ). , , 10-100 , . , , .

-


- , β€” - () .

- , , . SQL- , JSON-, , - () , ( JSON ).

. , , . .

, . , -, php7 ( ZendFramework3), SPA , ReactJS+Redux. API NodeJS KOA2. , .

, , . , , , jQuery , ReactJS . , , .

, . TinyMCE, . , TinyMCE .

, , , β€” , .

- , , , , , . , , .

, . , , . , . , .

, , - -. , -, , . .

-


- , , , β€” iOS, Android Web.

. iOS β€” : Swift IDE Apple , .

iOS Android Web, (, , , ).

Android . : - , ; - , Android . Android , .

Web, Android, , , , . . . Web- .


, β€” - . . , , , (. ) .



, β€” - β€” 40 . , , .



, , !





, , 54, . ( , ), App Store, Google Play , , . . , . , .


, -, , - . , , , .


, .

- .



, , " β€” " «» , βˆ€ ( " ... ", " ... "), :



" " β€”
β€” !



Release


. , . , , , , , . , , - .

, , ., App Store Google Play, . . 54 β€” . , , , 1- .

, . , , , , . All is ready. , .

, , . , App Store , , , , iOS- . ( ) " , ", , Apple β€” , .

14 , Web, iOS Android .

: ?


, β€” , , - . , , .

, , , . .

, , .

, , , , .


, β€” , ( , C ), , , , :


, , , .

Chat


, , . , , .




, , , ( , ) . , , Web-, , , iOS- iPad , .

, .


, .

, ( ) .

, , .

, .

, partner@repetitor.school . ( 2018 . ).



,


, . , , , , . , : , ( ) .



β€” , , . β€” , Facebook , Twitter , Instagram .

Epilogue


, . IT- β€” , , , , , , - ! , IT-.

. , , , , , , - - .

Source: https://habr.com/ru/post/350006/


All Articles