sportnet.sme.sk v1.0

Dizajn

https://xd.adobe.com/view/789822ce-407a-45d6-65d2-dd93a3b6bca3-0ea9/

Dizajn FUTBALNET

Desktop: https://xd.adobe.com/view/83370fff-745f-4461-ae6a-a869bdc9f884-d664/

Mobil: https://xd.adobe.com/view/8c5c6ec1-c485-4d11-beed-9d2da9b90467-d90f/

Záväzné dizajnové komponenty: https://xd.adobe.com/view/2542df01-e4d6-4741-ba3f-741593a711cf-7011/

Assets

Pozície reklám, niektorých prvkov a podobne bude potrebné komunikovať so zákazníkom. Dizajn berte skôr ako šablónu s prvkami, ktoré sa použijú, než ako finálny layout.

Poznámky

Podrubrika (napr. liga majstrov) bude mať hlavičku ako futbalnet

Otázky na call s M. Cholevom:

~~Homepage - titulné články - ktorý dizajn?~~
- jeden veľký článok, súvisiaci obsah zatiaľ nezobrazovať
~~Sidebar Dnes / Týždeň + Sidebar Najčítanejšie / Najnovšie - ktorá verzia?~~
- verzia Dnes / Týždeň, list s číslami
~~Hlavička stránky - Regióny - budú to rubriky Západ, Stred, Východ? budú rubriky Bratislava, Levice...? Ako budú vyzerať detaily?~~
- zatiaľ regióny v menu úplne vynecháme
~~Homepage - sekcia Aktuálna téma~~
- ako posledný blok sekcií sa zobrazí sekcia "Aktuálna téma", jej 4 podsekcie a 5 článkov (články zaradené do sekcie, podľa articleFilter nastaveného na sekcii "Aktuálna téma")
~~Dizajn detailu článku bežný / premiový - ktorá verzia? 6+7/27 a 8+9/27~~
- bežný: 6/27
- prémiový: 8/27
- šablóna prémiového obsahu sa bude vyberať na detaile článku
~~Detail článku "Ostatné športy" - breadcrumby / posledná sekcia / tag ? - je to ten istý tag ktorý je v zozname článkov?~~
- hlavná sekcia do ktorej je zaradený článok, rovnako aj v zoznamoch článkov
~~Podrubrika ako "Liga majstrov" - hlavička rovnaká ako na detaile futbalnet súťaže?~~
- áno
~~Stránka "OH 2020" - stránka tagu?~~
- sekcia s nastaveným pages layoutom "tema"
~~Dohodnúť sa odkiaľ, ktoré dáta - prejdeme podľa dizajnov~~
- tmavý pás video článkov
  - zoznam vyhovujúci filtrom: doctype="video"
  - v detailoch sekcií sa k filtru pridá sectionid
- zoznamy článkov ikona video/photo podľa system smarttagu

Analýza nezahŕňa

komentáre (detail článku, vizualizácia v zoznamoch, sidebar "Blogy a komentáre")
nasadenie konkrétnych reklám (na stránke budú tmavými blokmi vyhradené miesta pre reklamy, avšak samotná reklama tam zatiaľ nebude)
newsletter "Súhrn Sportnet.sme na email" blok
Kúpiť predplatné bude zatiaľ link nikam

Analýza obsahovej časti [160h]

z toho:
- hodiny na obsahovej časti portálu: 96h
- hodiny na obsahovej časti portálu sekcie futbalnet: 24h
- CRM: rozšírenie bia: 4h
- CMS: šablóna článku: 8h
- CMS: listingy: 20h
- CMS: najčítanejšie za posledných X hodín: 8h

Poznámky:

nový web postavený na službách sportnetu
custom implementácia csm/pages.public využívajúca pages, domains, cms APIs
práce potrebné na vytvorenie 1. verzie obsahovej (spravodajskej) časti portálu
obsahuje aj úpravy na platforme, ktoré sú potrebné pre vytvorenie portálu
štruktúrované sú podľa projektu, na ktorom treba vykonať práce a následne jednotlivé úlohy na danom projekte
keďže nie je jasné ako bude vyriešené prihlásenie, bude zatiaľ použité sportnet prihlásenie, ktoré už máme pripravené
"seckia" = "rubrika"
odhady zahŕňajú aj responzívnu verziu

csm/sportnet.sme.sk:

Hlavička: [16h]

z pohľadu pages je to nastavená "jednoduchá hlavička", avšak na sportnet portály bude custom implementácia výzoru tejto hlavičky podľa dizajnu
Riadok 1:
- nerobíme zatiaľ
Riadok 2:
- logo (+ logoLinkUrl)
- sekcie:
  - sekciu regióny preskočíme
  - desktop:
    - iba 1. úroveň, jednoduché linky
    - zobraziť prvé 4, ostatné za dropdownom viac, ak je viac ako 4
  - tablet:
    - plávajúce menu, rovnako jednoduché linky, animovat zmenu ikony menu na X
- zoznam partnerov:
  - desktop: obrázok, link
  - tablet: nový riadok
- vyhľadávanie
  - po kliku sa vytvorí nový riadok
  - po kliku na lupu / stlačení enter ideme na stránku vyhľadávania
  - výsledky vyhľadávania zobrazujeme až na stránke vyhľadávania
- fixná časť po scrolle
- progress bar pri čítaní článku

Pätička [4h]

z pohľadu pages je to nastavená "jednoduchá pätička", avšak na sportnet portály bude custom implementácia výzoru tejto pätičky podľa dizajnu
Súčasti:
- logo (+ logoLinkUrl)
- sekcie (center, wrap na mobile)
- sociálne siete
- text

NOT_FOUND podstránka [4h]

nadpis "Ľutujeme, stránka sa nenašla"
podnadpis "Stránka, ktorú hľadáte, nie je k dispozícii, alebo bola presunutá. Skontrolujte prosím zadanú url, alebo použite vyhľadávanie vpravo hore."
sidebar Dnes/Týždeň
zoznam článkov "Najnovšie správy"

Homepage [32h]

sidebar Dnes/Týždeň [2h]
- najčítanejšie články za dnes / za týždeň
veľký titulný článok [2h]
- načítaný a zobrazený listing na fix podľa listingId
- na teraz tento blok obsahuje len 1 hlavný článok (súvisiaci obsah vynechávame)
"Aktuálne témy" [2h]
- 4 podksecie sekcie "Aktuálne témy"
- celé názvy sekcií
titulný zoznam článkov [4h]
- načítaný a zobrazený listing na fix podľa listingId
- zoznam článkov
  - fotka, sekcia, dátum, typ(podľa system smarttagu), názov
  - prémiový obsah, ikona doctype=video, ikona typ obsahu(podľa system smarttagu začínajúceho znakom "_")
video pás [4h]
- zoznam vyhovujúci filtrom: doctype="video"
- v detailoch sekcií sa k filtru pridá sectionid
- na mobile horizontalny scroll cez react slick
sidebar Futbalnet [2h]
- logo na fix (link na sekciu futbalnet)
- články zo sekcie futbalnet
- linky súťaže, výsledky
bloky sekcií [12h]
- prvé 4 podsekcie sekcie pre hlavnú stránku
- na fix blok sekcie Aktuálna téma (zobraziť len prvé 4 podsekcie)
- blok seckie:
  - ikona
  - názov
  - zoznam podsekcií
    - zobrazenie toľko koľko sa zmestí
    - ak sa nezmestia skryje ich za dropdown za tlačidlom "3 bodky"
    - na mobile sa tlačilo zmení na "rubriky"
  - zoznam 5 článkov
    - články vyhovujúce sectionArticleFilter (nastavenie článkov sekcie v administrácii)
  - možnosť vložiť sidebar
  - možnosť obraziť len menší počet podsekcií
"Najnovšie správy" [4h]
- zoznam najnovších článkov
- logika "Načítať ďalšie články"

Detail sekcie [8h]

blok sekcie (rovnaký ako na homepage)
obsah sekcie
zoznam video článkov (doctype=video, secionid)
reklamy
zoznam článkov v sekcii + stránkovanie (predchádzajúce, nasledujúce, offset 5)

Detail sekcie témy [8h]

detail seckie, kde je nastavený layout "tema"
tagy: získame z sectionArticleFilter sekcie
názov
perex
obsah
sidebar Dnes/Týždeň
zoznam článkov v sekcii + stránkovanie (predchádzajúce, nasledujúce)
blok Aktuálna téma (rovnaký ako na homepage)

Detail Podsekcie [2h]

rovnako ako detail sekcie len iná hlavička sekcie

Stránka vyhľadávania [4h]

načítanie článkov podľa hľadaného výrazu
výraz v url ?search=
nadpis, zoznam + stránkovanie (predchádzajúce, nasledujúce), sidebar

Detail článku [16h]

dizajn: 4,5,6,8/27
1 breadcrumb
nadpis
titulný obrázok
tag Prémiový obsah, meno autora, dátum aktualizácie
widgety
- override:
  - fotka
  - zoznam článkov ("Súvisiaci článok" je nadpis zoznamu)
  - fotogaléria
zdieľanie
- desktop: plávajúce ikony
- tablet: tlačidlá vedľa dátumu aktualizácie
- na mobile: tlačidlá pod dátumom aktualizácie
- facebook, twitter, kopírovať link
- na mobile sa miesto kopírovať link použije native share api na zdieľanie ak je dostupné
sidebar Dnes/Týždeň
pozícia pre reklamu
tagy (zobrazíme zatiaľ len smarttagy článku - neklikateľné na prvú verziu)
author (fotka, name, bio, socialne siete) (sportnet api organizationPPOUser) ak má autor id inak nezobrazovať
diskusia (v tejto verzii len blok s nadpisom, bez komentárov)
súvisiace články
blok sekcie - 2. sekcia v poradí od rootu v ceste sekcie, do ktorej je zaradený článok
zohľadniť na článku nastavený iný layout (teraz budeme mať len default a "Prémiový obsah")
- layout "Prémiový obsah":
  - väčší obrázok
  - nadpis v obrázku
  - bredcrumb v obrázku
  - žiadny sidebar, vystredený obsah
odosielať po pár sekundách req na čitateľnosť (nový endpoint)

Blok prémiový obsah v obsahu článku [2h]

CMS obsah pre futbalnet
bude existovať sekcia "Futbalnet" (podsekcia sekcie "Futbal"), nachádza sa na url "/futbalnet"
dizajn mobile: 1/27, 15/27
dizajn desktop: 1/27 - sekcia futbalnet, 4/28 PPO, 8/28 PPO klubu, 11/27 - súťaž podľa smarttagov, 24/27 - zápas podľa smarttagov

Futbalnet/Podsekcia Futbalnet (tab prehľad) [6h]

landing zoznam článkov [2h]
- na fix načítaný a zobrazený zoznam článkov podľa listingu futbalnet
tmavý zoznam video článkov [2h]
- zoznam vyhovujúci filtrom: doctype="video"
- filter sectionid
- na mobile horizontalny scroll cez react slick
"Najnovšie správy" [2h]
- zoznam článkov zaradených do sekcie (sectionArticleFilter)
- načítanie a zobrazenie zoznamu článkov
- logika "Načítať ďalšie články"

Futbalnet/Prehľad zápasu [2h]

načítanie a zobrazenie zoznamu článkov
filter sectionid=futbalnet, smarttagy sutaze
články sportnet portálu

Futbalnet/Prehľad súťaž [4h]

načítanie a zobrazenie zoznamu článkov
filter sectionid=futbalnet, smarttagy sutaze
články sportnet portálu
pager "načítať viac"

Futbalnet/Prehľad Zväzu/Klubu [4h]

načítanie a zobrazenie zoznamu článkov
články danej PPO
načítať články PPO - "pages:{ppo_id}:default"
pager "načítať viac"

Futbalnet/Detail článku zväzu [8h]

rovnaký ako detail bežného článku
bez prémiového layoutu
sidebar Dnes/Týždeň zo sportnet portálu
hlavička zväzu
súvisiace články zväzu
bez bloku sekcie na konci článku

CoreII/crm.ui + CoreII/sportnet.api:

Rozšírenie bia používateľa [4h]

"Zhrnutie" (summary) - text area
Sociálne site
- "Facebook" (facebook) - input na link
- "Instagram" (instagram) - input na link
- "LinkedIn" (linkedin) - input na link
- "Twitter" (twitter) - input na link

csm/pages.ui + csm/pages.api + open-source/cms-connector + csm/cms.ui + csm/cms.api:

Definovanie article layoutu [8h]

v nastaveniach pages sportnet.sme.sk budú uložené layouty dostupné layouty pre články
layouty budeme posielať pomocou cms-connector do cms.ui
v detaile článku bude možné vybrať layout pre článok (layout sa uloží na objekt článku)
každý článok použije Default pokiaľ sa nenastaví inak
administrácia na layouty článkov nebude existovať
nastavenie layotu do nastavení sportnet.sme.sk
- zatiaľ bude len 1 pre Prémiový obsah

csm/cms.api

Listingy [8h]

admin CRUD endpointy pre listingy

Listing:
  type: object
  properties:
    _id:
      type: string
    listingId:
      type: string
    contentspace:
      type: string
    name:
      type: string
    articles:
      type: array
      items:
        type: string
    articleFilter:
      type: array
      items:
        type: object
        required:
          - type
        properties:
          type:
            type: string

public endpoint na získanie článkov z listingu /public/{appId}:{appSpace}:{contentDivider}/listing/{listingId}/articles - getPublicListingArticles

csm/cms.ui

Správa listingov [12h]

do admin cms.ui pribudne nová položka v navigačnom menu "Listingy"
zoznam:
- identifikátor, názov
- vytvoriť nový
detail:
- názov, identifikátor
- 1. tabuľka so zoznamom článkov, ktoré sú fixne nastavené pre listing (dôležité je poradie)
  - rovnaká tabuľka ako v zozname článkov
  - články viem preusporiadať
  - články viem odstrániť z listingu
  - zobrazovať počet zobrazení
- filter na zoznam článkov
- 1. tabuľka so zoznamom článkov vyhovujúcim zadanému filtru
  - rovnaká tabuľka ako v zozname článkov
  - články viem pridať medzi fixne nastavené články
  - zobrazovať počet zobrazení

csm/cms.api

Najčítajnejšie za posledných X hodín [8h]

api na zaznamenávanie počtu zobrazení článku a dopytovanie sa podľa X hodín