Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Designing Website Application as An Academic and Non-Academic Assistive Tool for Students with Slow Learner Devanny Gumulya.
Sn.
Kristian Harijadi Universitas Pelita Harapan kristianharijadi@gmail.
gumulya@gmail.
Abstract The COVID-19 pandemic has resulted in PSBB (Large-Scale Social Restriction.
regulations that affect all aspects of life, one of which is the education sector.
Changes in the education system that have occurred significantly have many schools and are not running smoothly.
In this case, the percentage will be even greater for students with special needs, especially students who are included in Slow Learner.
The purpose of this research is to innovate in the development of assistive technology, improve the learning experience for students with special needs.
The research result is a website application named Temaninklusi is a website application design proposal for lecture to create digital pictorial card as a additional learning material for Slow Learner at University level, as pictorial card has been proven as an effective tool to assist reading comprehension since early age.
The website application also connects lecture, mentor and counselor to help slow learner adjusting their academic life.
Keywords: Website Application.
Slow Learner.
Assistive tool.
INTRODUCTION
The COVID-19 pandemic has an impact on all aspects of life, including health, the economy, and Many people were forced to stay at home due to the implementation of physical and social distancing (Leksono, 2.
This significant change certainly did not go smoothly and experienced many obstacles.
According to Adnan .
, the biggest obstacle for distance learning in developing countries is that many students do not have internet access and gadgets to study online because of economic constraints.
In addition, studentAos comprehension is decreasing due to the lack of direct interaction between teachers and students, the lack of teacher control on the student's learning conditions, and the teacher is unlikely to pay attention to all students individually turning on the video camera at the same time to the maximum.
These constraints will be greater for students with special needs, especially Slow Learner Students who have limitation in their cognitive ability.
Looking at data from the Ministry of Social Affairs of the Republic in 2011 the number of children with special needs in Indonesia reached 7 million people and about 3% of which is 210,000 are slow learners, autistic and tuna grahita.
Furthermore, there has been no latest data in the last period, but some sources explain this data increases per year.
For example, a case study, from a study at a state school in Yogyakarta, of all students with special needs 80% of them are slow learner Thus this study states that many slow learner children who are not detected their limitations and then attend regular formal schools (Amdany et al.
, 2.
Research from this journal focuses on slow learner students.
According to Amelia .
Slow learner (SL) is "students who are slow to learn, so it takes longer than a group of other students who have the same level of intellectual potential.
person who has low achievement .
elow the average child in genera.
with his IQ test score between 70 - 90" (Giawa et al.
, 2.
Page | 17 Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Due to above average IQ, then SL have difficulties in understanding the lesson and learning new skill.
Slow learner requires repeated explanations for a single teaching material (Mahastuti, 2.
SL takes longer to do the task.
SL hae difficulties in understand reading, and text is a basic component of a user So, these two are interlinked.
For this reason, it is interesting to research and in this journal a website application is designed for slow learner to facilitate learning through pictorial card.
As previously spelled out.
SL has difficulty in understanding reading.
According to Najma et al.
factors that can cause difficulty reading are limited concentration power and low levels of attention reduce the ability to learn and abstract and generalize experiences and this also leads to the ability to connect words and meanings.
For that learning tool is needed for SL who have difficulty understanding the reading completely from text.
Levie and Lentz .
in Widyana & Dewi .
proposed four pictorial media functions as learning The first is the attention function, interesting images serve to capture the concentration of students during learning.
The second is the affection function, the image is used to trigger learnerAos The third is cognitive function that aims to keep information in mind longer.
The fourth is a compensation function in which image media helps students with low reading skills to organize and remember information within the text.
So, the text is converted into an image.
These four functions are very helpful for SL in learning from what is read.
Pictorial media activates SL visual sensors, allowing students to remember the material being studied, reducing the pressure of the amount of information to be learned.
METHOD
The design process uses a participatory approach that provides opportunities for designer subjects, namely Slow learner students to be involved in the design process.
The design starts from a search of the problem search of the topic and supporting data.
Primary and secondary data helps to identify and find solutions to problems.
Primary data obtained from conducting interviews and questionnaires are:
Interview Interviews were conducted on 3 groups, namely students of Slow Learner, their families and teachers who used to accompany and teach children with Slow Learner.
This interview was conducted to 8 Slow Learner students from various majors and universities, their mentors and 1 teacher who used to teach children with Slow Learner.
During pandemic conditions like this, all interview activities are conducted online.
The purpose of this interview is to find out about the problems experienced by Slow Learner students at the lecture level, in both academic and non-academic aspects.
With the use of interview methods, the designer hopes to know in detail about the views of Slow Learner students and their companions on the experience of learning online.
Questionnaire Questionnaires were conducted to Slow Learner students with a total of 8 respondents, the same as those previously interviewed.
This questionnaire is done while in the process of creating a display design, by asking for opinions about the layout, colors, content and others related to the display.
In addition, data collected in the secondary data / literature study discuss:
Definition.
Symptoms, and Classification of Autism Spectrum Disorder Learning Methods on Autism Spectrum Disorder Page | 18 Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Universal Design for Learning Universities' Support for Autism Spectrum Disorder Human Information Processing Special needs friendly website display Proceeding to design process, the design of this application website is based on problem solving of the data that has been obtained.
From drafting, sketching ideas, drafting views, to the final prototype.
Page | 19 Method From the interview, the designer asked about one of the learning with pictorial card.
Most of the speakers have already used this method and find it helpful.
Teachers also recognize that this method is also used in the teaching process and becomes one of the effective methods for Slow Learner With this, designers want to adapt this method and make it more complex for Slow Learner students to use as a learning tool.
From the interview, students have different problems and ways of learning, some have problems that tend to be academic, some tend to be non-academic, and some have visual, auditory or kinestetic ways of learning.
With different problems and ways of learning, the designer also decided to help students in academic and non-academic aspects by using 3 main menus in the website, namely study, buddy and community.
The study menu is the main menu that helps in the academic aspect, buddy is the main menu that helps in academic and non-academic aspects, as well as the community which is the main menu that helps in the non-academic aspect.
Most of the interviewees also have difficulty when self-learning, because the learning media they use is new to them, for example the use of online meeting applications such as Zoom, or Google Meet at the beginning, the provision of learning materials that are quite confusing such as powerpoints consisting mostly of difficult writing and words, which even the layman is still confused in digesting the powerpoint , as well as what confuses them the most is when searching for materials or learning through browsing to some websites that are not Slow Learner friendly.
According to Brian Yu .
, the friendly website view for Students with special needs are as follows:
Less Animation The presence of animations is thought to cause distractions or distract from moving images.
addition to animations are also actually ads are also included, because sometimes ads also move and use striking colors.
Color and background determination The use of colors in a website should not have a very diverse color.
According to tests conducted, pale pink color is nominated as children's favorite color SLOW LEARNER.
What's more, colors that give the impression of "cool" such as blue and green can create a comfortable atmosphere.
Font determination Many SLOW LEARNERs say that they prefer Garamond fonts, but many also think that sans-serif fonts are also good such as Helvetica.
Verdana or Comic sans.
Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Page | 20 Figure 1 SLOW LEARNER-friendly website main page view Figure 2 Less SLOW LEARNER-friendly website main page view One example of an Special needs friendly website page is a website from the Association for Higher Education Access &Disability's Ahead.
In the website, it has a feature that allows users to change the views of the website.
The change of appearance in the website includes the color of the background of the website, the size of the writing even has a sound feature that reads the entire writing on the website.
Figure 3 Ahead.
ie website view On the UK government's website, they publish things that should be done and that should not be done in designing displays for people with special needs What to do:
A Use simple colors A Use easy-to-understand languages A Use simple sentences and bullet points A Create descriptive buttons A Create a consistent layout Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia What not to do:
A Use bright colors A Use images to explain what they mean A Create a sentence with a column A Create a button that doesn't explain the purpose A Making complex layouts Questionnaire In addition to being fixated on theory data, in the design process the designer involves SLOW LEARNER students in determining about the things about the look because it tends to be those who use the application website later.
In the questionnaire given.
SLOW LEARNER students, most choose to use the blue color of the many colors given, according to the theory.
In addition to the given card layout, it is likely that they are familiar with the initial card design in draft UI 1, compared to other alternatives as card layouts.
Discussion Criteria What : An application website as a learning tool for mild Slow Learner students in both academic and non-academic aspects.
The name of this app's website is a AuTemaninklusiAy.
Where : The learning process can be done anywhere as long as it has adequate facilities.
The use of the website as a container makes this application more accessible so that it becomes more flexible.
When : The learning process can be done at any time.
Why : An application website is designed so that students mild Slow Learner can follow the lecture to the maximum so that the student has the best quality at graduation so that it can compete later in the world of work.
Who : Students who are experiencing lectures, lecturers who are appointed or have students Slow Learner in their class.
Mentors and Counselors who are appointed to accompany students slow learner.
How : This application website will consist of 3 main menus, namely study, buddy and The study menu focuses more on the academic aspect, the buddy menu is balanced between academic and non-academic, and the community menu will focus on the non-academic aspect.
In the study menu, the teacher or lecturer will provide all the lecture materials in the menu, but in this menu, teachers can provide learning with pictorial card.
The use of this method makes the learning taught more visual and more simplified to make it easier to understand In the buddy menu, there will be two-way communication between students and teachers, mentors or counselors.
Teachers can be more helpful in academic fields, mentors in academic and non-academic fields, while counselors are more non-academic.
This menu is basically a messaging app, but in this menu, students can directly ask about learning materials and PECS that are already connected to this feature.
While in the community menu, it will take the form of a forum where students can ask each other questions or share tips about lectures or others.
Page | 21 Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Lifestyle:
Page | 22 Figure 4 Moodboard Lifestyle Theme Figure 5 Moodboard Theme The theme that serves as the keyword of this design is Clean and Easy-Access.
In the website, the given look wants to impress simple, then the use of decoration on the website is quite a bit and does not use a lot of colors.
The use of decorations and colors slightly conforms to the criteria of a friendly website for individuals with Slow Learner.
The use of Easy-Access keywords is so that users can easily understand and use the website well, especially the purpose of this application to be a learning tool that should be more accessible and learned from the website used before.
Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Design Process Page | 23 Figure 6 Sitemap Sketch sitemap in Figure 8, covering the initial creation ideas of the application website includes the division of the main menu in this website namely the study menu, buddy and community.
In this sketch, you can see which looks should be created and designed for the application website later.
Figure 7 Sketch #1 Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Page | 24 Figure 8 Sketch #2 In the sketch above, there is a rough picture of what is contained in each menu and a rough picture also about the placement of elements on the display.
This sketch is more detailed than the previous sitemap sketch and can be used as a guideline when creating prototypes.
Alternative Design Alternative design was asked to the Slow Learner and the design alternative was made according to their feedback.
In the notes view in the Learn menu, there are some gradual changes.
Here's the first look at how notes are viewed.
Figure 9 Alternative Design Ae View Note 1 In Alternative Design 1, view view this record displays data that is referenced for example in the form of a presentation or document that can be raised and hidden.
This display displays a small card so that the words that can be entered are only the cores, so that the cards can be arranged some sideways Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia even down in the line behind the card or sentences maker.
But this view has a drawback that the size of the writing tends to be very small especially for cards and also the display for reference is enough to make the focus become split so it must be fixed.
Page | 25 Figure 10 Alternative Design Ae View Note 2 In alternative design 2, it still adapts the elements contained in the PECS such as cards, and the lines behind the cards.
From this view, students must press the check button below the card in order to press the next button.
There are some drawbacks to this view: the columns for notes are less large, there is no view that focuses the user on having to press the check button first, and the writing size is quite small, making it still difficult to read.
This display was done trials to some students with autism, at first it seemed that students were confused what to do, and tended to try to press the next button when they had to press the tick button Figure 11 Alternative Design Ae View Note 3 In the 3rd design alternative, there have been some changes, namely the addition of the number of cards at the top right of the card window and also below with the help of numbers, the card has also Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia been enlarged from the previous size, in the example in figure 11, the material is used as an example as well as a long material, there is the addition of a voice feature to help students who have an auditory learning style and there is also a full display feature to further enlarge and focus on the card.
In this view, the flow is that after the student reads and listens to the material provided, the student is required to write a note before being able to press the right or forward arrow keys.
But this display Page | 26 also has the disadvantage that the main focus seen in this display is the right or advanced arrow keys because of the striking color and also the size is quite large, whereas the note should take precedence over the advanced button and the advanced button here is also only in the form of an icon only, there is no explanation of the action performed, not in accordance with the principle of designing for disabilities, then this design still has to be improved.
Figure 12 Alternative Design Ae View Note 4-1 Figure 13 Alternative Design Ae View Note 4-2 The view in figures 14 and 15 is the final view of the notes view on the study menu.
In this view, the navigation menu is omitted to give extra space to the card window and replaced in the menu at the top right of the screen.
In addition, there is also a bar display that shows the number of cards and card numbers being studied, and there is also only one button that becomes the focus in addition to the Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia card which is the next button that when pressed just brings up a window to write notes.
In this view, the focus path is easier compared to the previous view, so it is expected that this view can be easily Page | 27 Figure 14 Alternative Design Ae Create Note 1 In addition to the note view on the study menu, the note-taking view also has significant changes.
this view, the concept used is "drag and drop", users can directly use the tools provided to create cards, and there are also commonly used templates.
In this view is also provided a view of data that is used as a reference so that users do not have to use 2 working windows at the time of card creation.
However, after experiments on autism students and teachers, there are only many shortcomings such as small writing size and also a crowded appearance that must be improved.
Figure 15 Alternative Design Ae Create Note 2 Here's the final look of the note-taking view on the Learn menu.
This view change is quite far from the previous view.
In this view, no longer use the previous draft, but use the concept as if it were filling out a form.
Users simply enter the card title, photo, audio, and description to create a card that the app will be able to convert to a view at the time of viewing the note.
Before saving, users can also check the display shape of the card by pressing the view button.
Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Final Design Page | 28 Figure 16 Login view Figure 18 is an entrance view for students.
Students are required to fill in their email address and password for if they already have an account, otherwise students can create an account first by pressing the sign up button.
Figure 17 Register View Ae Account Information Figure 19 is the first view when pressing the list button on the previous menu.
In this view, students are required to fill out a form in the form of an email, password and confirm the password.
This data will be used when students want to log in to their website later.
Figure 18 Register View Ae User Information Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Figure 20 is the second look at the registration process.
At this stage, the data is filled in here is demographic data that includes full name, gender, place of birth date, place of residence and contact that aims to know the identity of the student.
Page | 29 Figure 19 Register View Ae Family Information Figure 21 is the third display in the registration process.
At this stage, filling in the data here is demographic data of the family which includes full name, status, residence and contact so that at any time needed information or assistance to the companion, can be directly contacted.
Figure 20 Register View - Profile Figure 22 is the fourth display in the registration process.
At this stage, the filling of data is more personal than the previous one which includes hobbies, and favorite topics.
With this data, it is expected that lecturers can be used as a reference in the learning process.
Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Page | 30 Figure 21 Register View Ae Learning Information Figure 23 is the last look at the registration process.
At this stage, the data is filled into the academic which includes the name of the university, majors, year of entry, semester, student parent number and learning style.
With this data, it is expected that teachers will be able to adjust to the learning style of students to be more maximal.
Figure 22 Main menu view - Study Figure 24 is the main display of the student's study menu.
In this view, students can add lessons or courses by entering the code that the teacher has already provided.
In addition, if you have entered the code, you will see a list of subjects that have been registered with the help of the name of the course, illustrations of the courses and teachers who teach.
Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Page | 31 Figure 23 Study menu view - Material Figure 25 is a look at study menu when students press one of the courses.
In this view, students are shown a list of topics during the lecture per week, can see the topic title, a brief description of the topic, material files that can be pdf, powerpoint or audio and also students can see notes that have been created by the teacher or make their own notes.
Figure 24 Study menu view Ae View note Figure 26 is the view where students see notes that teachers make.
In this view, students can see the course name, topic title, and navigation menu at the top of the view.
Students can also see the number of cards on the record, and the main thing is that students can learn from the cards that have been created by the teacher.
On the card, there are titles, images, descriptions and audio.
When finished, students are required to press the next button to continue by adding a personal note.
Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Page | 32 Figure 25 Study menu view Ae Create note Figure 27 is the view when a student presses the "next" button in the previous view.
At this stage, students are expected to provide notes on cards that have previously been read.
There is also a card on the left that is not as big as before to recall the materials taught.
If you want to listen to audio again, students can press the back button next to the advanced button.
After you continue, the view will return like the next card with a different card until the card runs out later.
Figure 26 Study menu view Ae Give feedback In figure 28 is a view of giving a review at the end of the lesson.
At this stage, students can provide reviews about the learning that has been done, with this expected teacher can get input from students so that teachers can make progress on the next learning.
Figure 27 Student profile view Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Figure 29 is a view of when a student makes his or her own notes.
In this view, students can create their own notes by filling out the provided form that includes the title, image, audio and description.
Students can determine how many cards, can delete cards that have been created, view the card view and save cards.
To make it easier at creation, students can see the full sentence .
f it's too lon.
in the description field by hovering over the provided column.
Page | 33 Figure 28 Main menu view - Buddy Figure 29 Buddy menu view Ae Sending card Figures 30 and 31 are the buddy's menu views.
In this display, students can have conversations with lecturers, mentors and counselors.
Counsellors are from UPH psychology faculty.
The lecturer's contact will automatically connect with the student when the student enrolls in the class.
In this display, students can also insert a card made by the lecturer to make it easier when asking for Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Page | 34 Figure 30 Main menu view - Community Figure 31 Community menu view Ae Add question Figure 32 is the main view on the community menu.
In this view students can ask questions by filling out the form in figure 33.
In addition to being able to ask questions, students can also see questions asked by others, leave comments and like them.
Students can also filter like my questions that only show the questions referred by the student and liked that show all the questions that have previously been liked by the student.
In addition to questions, students can also relate to campus communities by pressing one of the names on the campus community sub-menu.
By pressing the name, students will be shown the community contact from instagram to the contact of one of the community administrators.
Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia Page | 35 Figure 32 User Profile Figure 34 is my profile view.
In this view, students can change their personal information data if they have previously encountered an error when entering the data or have not been able to fill in the data.
Figure 33 Teacher profile view Figure 35 is a teacher profile view for students.
In this view, students can view personal information about the teacher and can directly contact the teacher by pressing the "call" button which will then proceed to the buddy menu.
CONCLUSION
From the research that has been done, the authors concluded that special education for students with special needs, especially for slow learner is needed at a university.
It is also important for universities to check with each student to detect students with special needs.
This checking process tends to be important so that students with special needs get the quality of learning that suits the learning style and capacity of the student, knowing that the student has special needs, the teacher should be able to provide suitable teaching methods to the student so that students are easier to understand the materials taught.
In addition, teachers do not have other views on the student, and so that students Jurnal Desain Indonesia Volume 03, nomor 02 Ae Aliansi Desainer Produk Industri Indonesia with special needs can become good quality graduates.
By making students with special needs a good graduation, in the future they can compete with other graduates in order to reduce unemployment in people with special needs.
Temaninklusi is a website application for lecture to create digital pictorial card as a additional learning material for Slow Learner at University level, as pictorial card has been proven as an effective tool to Page | 36 assist reading comprehension since early age.
The study recommended some important variables for designers who want to design a website that is Slow Learner friendly are as follows:
Clear Hierarchy The order of priority is made from top to bottom with larger headlines, description sentences with smaller sizes.
Simple words and sentences Word selection becomes important for SL, words used daily are arranged with simple sentences instead of complex sentences.
Dominant white space The white part should be dominant, so it looks at what to focus on per page of the site.
Simple layout The layout should be simple, 1 column is better, when a maximum of two columns are needed Blue saturation The soothing color for SL is saturation of blue color Aside from design recommendation, the study also indicated that the environment influence Slow learner students.
Seen from the interviews conducted, the escorts are parents, providing support to these slow learner students.
In addition to mentors, teachers and friends also have an influence on slow learner students.
Hence, on this web application, the author wants to create an environment that supports Slow Learner students by connecting them with lectures, mentors and counselors.
ACKNOLEDGEMENT
We thank our Faculty of Design Dean Dr.
Martin L.
Katoppo S.
, and the Chairman of Center for Research and Community Development (CRD) Dr.
-Ing.
Ihan Martoyo.
Sc.
This article is a research publication registered in Center for Research and Community Development (CRD) of Pelita Harapan University under number P-003-SoD/II/2020.
REFERENCES