A képernyőoldalak kialakítása során az alkalmazás látványát néhány fontos szabály figyelembe vételével kell kialakítani: rugalmasság, könnyű megtanulhatóság, biztos célelérés. Ezek a műveletek még nem számítógépen, hanem kézi rajzok formájában történnek.

1. A tervezési elvek betartásakor a hatékonyság érdekében fontos a megjelenítés. Ezért minden képernyőnek könnyen érthetőnek, vonzónak és oktatási szempontból hatékonynak kell lennie affektív és kognitív szempontból. (L. még a médiaismeret fejezet.)
2. A képernyő tervezésekor a képkomponensek (szöveg, szín, állókép, animáció, videó) összhangját, kiemelő, figyelemfelhívó jellegét kell szem előtt tartani.
Az elektronikus szöveg összetett funkciójú (tartalom, forma, navigáció). Jellemzői:

• Szövegsűrűség, sortávolság. 8-10 szóból álló sorokat ajánlatos alkalmazni. A kétszeres sortávolság kismértékben növeli a megértés fokát.
• Statikus képernyő vagy gördítés. A gördítési lehetőség fontos dinamikai jellemzői az alkalmazásnak. A folyamatos (soronkénti) gördítés hatásosabb, mint az ugrásos (több sort átugró) forma. A gördülő szöveget a felhasználók nehezebben értik, mint a statikus képernyőszöveget.
• Sorok igazítása. A sorkiegyenlítés – a változó szóközök nehezen olvashatósága miatt – nem ajánlatos.
• A sorok töréspontját célszerű úgy megválasztani, hogy azok még értelmes szövegrészeket válasszanak el.
• Kisbetű, nagybetű: a kisbetűk – méretük alakjuk miatt – karakterisztikusabbak, mint a nagybetűk.
• A színek hatásából és a tanulási teljesítmény vizsgálatából arra következtetésre jutottak, hogy legfeljebb 4 szín alkalmazható, és ezek is konzisztens módon (pl. szintek).
• Kiemelés színekkel: Ugyanazon háttérszín alkalmazása esetén a 4-nél több szín alkalmazása elfáradást, túlzott szemigénybevételt és figyelemelvonást eredményezett. Ugyancsak elfáradást és túlzott igénybevételt jelentett a szem számára az egyszínű szöveg. A legkedvezőbbnek a 4 szín alkalmazása bizonyult.
• Előtér és háttérszínek vizsgálatakor kimutatták, hogy a fekete háttéren a fehér, a sárga, a ciánkék és a zöld a legjobban, míg a bíbor, a vörös és a kék a legkevésbé olvashatóak. Legkedvezőbbnek a fekete háttéren alkalmazott zöld szín bizonyult. Komplementer színeket (kék-sárga, vörös-zöld) – a fellépő komplementer utókép miatt – nem célszerű előtér-háttér párosításban alkalmazni. Ezek a színek rivális színek.

Álló és mozgóképek

Az állókép. Számos kísérlet van arra, hogy a képi anyagoknak közvetlen útvonala van a rövid idejű memóriából a hosszú idejűbe. Már a papíron alkalmazott illusztrációkról megállapították, hogyha a képek releváns módon kapcsolódnak a szöveghez, úgy javítják a szöveges anyag megértését, az emlékezést és az anyag megtanulását. Változatok a képi ábrázolás realizmusának foka szerint:

• reprezentációs (fotorealisztikus) kép,
• analóg ábra (valamilyen hasonlóságra törekszik),
• logikai ábra (az eredetire nem emlékeztet, de belső tulajdonságait visszatükrözik).

A nagy valósághűségű anyag csak a magas intelligenciájú tanulóknak jelent eredményes tanulást. Az alacsonyabb intelligenciájúak számára nem volt informatív, ezért feleslegesnek tűnt, ugyanakkor a valóban fontos részletek kiválasztása számukra olyan többletterhelést jelentett, amely már csökkentette tanulásuk eredményességét.
Az ikonok. A kombinált (szöveges és képi) ikonok gazdagabb jelentésűek, mint a csak képi vagy csak a szövegesek.
Az animáció fokozza a tanulók érdeklődését és javítja a témához való hozzáállásukat.
Videojeleneteket akkor alkalmazunk az állóképeknél, ha több információt hordoznak. A személyes megszólítás eszköze is, de a narrátor folytonos megjelenése unalmassá is válhat. Fontos, hogy a képi és hang általi közlések erősítsék egymást.