---
# System prepended metadata

title: Scopevisio Konzepte

---

<iframe width="10%"
src="https://www.scopevisio.com/wp-content/themes/scope_theme_parent/img/scopevisio-symbol-gelb.svg" frameborder="0"></iframe>


# Scopevisio Konzepte
[ToC]

---

# 💡Notizen

::: info

## Todo
- Beispiele raussuchen

## Planung

- Telko 1 h 1x die Woche mit Silke
- Alles mehr auf Vorlagen aufbauenx1
- Ist Milan noch dabei?

:::

---




# **🆕 News Bereich**

::: info

# **Konzeptentwurf**

## ⚡️ Leitgedanke
- "So leicht zu beziehen wie Strom aus der Steckdose"
    = Software "anschliessen" und Problem lösen – ohne mich damit zu beschäftigen

## 🧠 Wichtige Aspekte

Primär:

- 🗂 Dashboard Unternehmensbereiche/Aktivitäten (Work)

Sekundär:
- 📄 Vorlagen (Setup)
- 🚀 Einrichten (Setup)
- ⚙️ Einstellungen (Setup)
- 📱 Addons / Apps (Setup)
- 📣 News (Lernen) 
- ⚡️ Schnellaktionen (Work)
- ⏱ Forumlare kürzlich geöffnet (Work)
- 📌 Formulare angepinnt (Work)


# Prototyp

- Design auswählen (IST/SOLL)
- Perspektive
    - Neukunde
    - Wiederkehrender Nutzer Allgemein
    - Wiederkehrender Nutzer Spezifisch
– Journey
- Widget
    - Konfigurationsmaske
    - Widgets hinzufügen
    - Ansichten wählen
    - Aufbau
        - Aktivitäten
        - Formulare
        - Schnellzugriff
        - Addons
        - Vorlagen
        - News
        - Werbung
        - Kürzlich geöffnete Formulare
- Import Funktion
- Favoriten
- News




## 👫 Zielgruppe
- 🟡 Neukunde
- ⚪️ Bestandskunde


## ℹ️ Anmerkungen
- Coworking vs Teamwork (Namensbeissung)

:::

# **📱 Scopevisio 2GO**

::: info

# **Konzeptentwurf**

## ℹ️ Anmerkungen
- Coworking vs Teamwork (Namensbeissung)

::: 

## **Bereiche**

### Einstellungen

## **Funktionen**
---

# 📄 Spesen APP

:::info

### **Klickdummy**


<iframe width="100%" height="500" src="https://xd.adobe.com/embed/0bb42298-ba51-4517-4403-94f6f45220b5-7d85/screen/1763a6ce-c651-49ea-90b2-a6064a1de46f" frameborder="0"></iframe>

### Ressourcen
- **Ticket Jira:** https://ticket.scopevisio.com/secure/RapidBoard.jspa?rapidView=97&projectKey=SPES
- **Font:** https://gitlab-fr-01.fr.scopevisio.local/web-entwicklung/fonts.git
- **Roadmap Board:** https://miro.com/app/board/uXjVOV2Sk2M=/?track=true&utm_source=notification&utm_medium=email&utm_campaign=approve-request&utm_content=go-to-miro
- **Klickdummy Azis:** https://xd.adobe.com/view/cde70d45-10ba-4413-b256-91e1cf9fea5c-98b4/

### Ähnliche Apps

- https://www.expensify.com


#### Klickdummy
https://xd.adobe.com/view/61926d9a-fc86-4f46-9f42-bb6137b84a1b-34c1/
Vorherige Version:****
[https://xd.adobe.com/embed/0bb42298-ba51-4517-4403-94f6f45220b5-7d85/](https://xd.adobe.com/embed/0bb42298-ba51-4517-4403-94f6f45220b5-7d85/)


## Icons

### Fehlend
- Taschenlampe

## Nicole


**Overview**:

Implementierung einer Reisekosten- und Spesen-App

**To Do:**

- DokumentenÃ¼bersicht (DocumentsView.vue)
    - Vorschaubild hinzufÃ¼gen
    - ErstattungsfÃ¤hig Symbol und Text hinzufÃ¼gen
    - Datum hinzufÃ¼gen
    - Projekt hinzufÃ¼gen
    - MÃ¶glichkeit, Sammlungen zu erstellen und zu lÃ¶schen, hinzufÃ¼gen
- Detailansicht eines Dokuments (DocumentDetails.vue)
    - Info-Tab
        - Detailseite und Add-/Editseite (DocumentDetails.vue & DocumentEdit.vue) miteinander mit aktuellen Dokument verknÃ¼pfen
        - Zoom-In und Zoom-Out beim Dokument-Bild hinzufÃ¼gen fÃ¼r eine bessere Lesbarkeit
        - Geste fÃ¼r das Zoom-in und das Zoom-out hinzufÃ¼gen
        - Delete-Button verschÃ¶nern
    - Kommentar-Tab
        - Zeilenumbruch bei langem Text einbauen pop-up?
- Scanner
    - ScanmÃ¶glichkeit implementieren - OCR
    - Scan bearbeiten (zuschneiden, drehen, usw.) kÃ¶nnen
    - Buttons anders positionieren
- HinzufÃ¼gen eines Dokuments bzw. Bearbeitung eines Dokuments (DocumentEdit.vue)
    - Detailseite und Add-/Editseite (DocumentDetails.vue & DocumentEdit.vue) miteinander mit aktuellen Dokument verknÃ¼pfen
    - Pflichtfeld fÃ¼r Radio Buttons anpassen
    - Metadata anpassen
    - Ãœbernehmen-Button verschÃ¶nern
- Einstellungen
    - Foto Einstellungen machen kÃ¶nnen
    - (Falls gewÃ¼nscht: Gesellschaft, Passwort und Impressum nicht auf eine neue Seite verweisen, sondern ausklappbar - da Seite so leer ist) ?
    - Impressum implementieren
    - Ausloggen-Button verschÃ¶nern und an einer andere Stelle platzieren

**Noch abzusprechen**:

- Anmeldung
    - Ist ein Login Ã¼ber Google etc. gewÃ¼nscht?
- Projekt
    - Welche Projekte sollen angezeigt werden und wie?
- MenÃ¼
    - Welches Design soll das MenÃ¼ haben (links oder unten)?
- Lange Kommentare
    - Wie sollen lange Kommentare dargestellt werden (ausklappbar oder nach mit Zeilenumbruch)?

- Nächste Themen:
    - Vorschau für Datei anschauen
    - Detail Zustände auflisten

**Actual Results:**

- DokumentenÃ¼bersicht (DocumentsView.vue)In der DokumentenÃ¼bersicht kann man einen Teamwork-Ordner Ã¶ffnen und sieht die dort enthaltenen Dokumente.Â Der Ordner kann nach einem Dokument durchsucht werden (Suchleiste lÃ¤sst sich ausklappen) und der Ordnerinhalt kann auf 5 verschiedene Arten sortiert werden (TrefferqualitÃ¤t, Datum (neueste zuerst), Datum (Ã¤lteste zuerst), Name A-Z, Name Z-A) sowie in 3 verschiedenen Weisen angezeigt werden (Listenansicht, Ansicht mit groÃŸen Bildern, Ansicht mit kleinen Bildern). Klickt man auf ein Dokument, wird man zur Details-Seite navigiert.
    
    ![https://ticket.scopevisio.com/secure/attachment/59339/59339_image-2021-12-09-18-28-09-744.png](https://ticket.scopevisio.com/secure/attachment/59339/59339_image-2021-12-09-18-28-09-744.png)
    
- Detailansicht eines Dokuments (DocumentDetails.vue)Die Detailansichtseite eines Dokuments besteht aus zwei Tabs. Dem Info-Tab und dem Kommentar-Tab.
    - Info-TabDer Info-Tab zeigt ein Bild des Dokuments (dabei spielt es keine Rolle, welches Dateiformat das Dokument hat), den Belegname, das Belegdatum, das dem Dokument zugehÃ¶rige Projekt, die Belegart und die ErstattungsfÃ¤higkeit an. Zudem lÃ¤sst sich das Dokument im Info-Tab bearbeiten und lÃ¶schen. Die MÃ¶glichkeit zum Bearbeiten des Dokuments ist nur im Info-Tab da und nicht beim Kommentar-Tab. Beim Klicken auf den Pencil wird man zur Bearbeitungsseite navigiert. Beim Klicken auf den LÃ¶schen-Button wird man gefragt, ob man das Dokument wirklich lÃ¶schen mÃ¶chte. BestÃ¤tigt man dies, wird man zurÃ¼ck zur DokumentenÃ¼bersicht navigiert.
        
        ![https://ticket.scopevisio.com/secure/attachment/59345/59345_image-2022-01-13-16-56-27-185.png](https://ticket.scopevisio.com/secure/attachment/59345/59345_image-2022-01-13-16-56-27-185.png)
        
    - Kommentar-TabDer Kommentar-Tab zeigt - je nachdem wie viele Kommentare fÃ¼r das ausgewÃ¤hlte Dokument vorhanden sind - die Kommentaranzahl an und listet alle untereinander auf. Unter den Kommentaren gibt es die MÃ¶glichkeit, weitere Kommentare hinzuzufÃ¼gen. Jeder Kommentar lÃ¤sst sich bearbeiten oder lÃ¶schen. Beim Bearbeiten wird die "Kommentar-HinzufÃ¼gen" EingabemÃ¶glichkeit zu einer "Kommentar-Bearbeiten"-MÃ¶glichkeit umgewandelt und beim LÃ¶schen wird man zuerst vorher gefragt, ob man sich sicher ist, dass man diesen Kommentar lÃ¶schen mÃ¶chte.
        
        ![https://ticket.scopevisio.com/secure/attachment/59340/59340_image-2021-12-09-18-29-39-431.png](https://ticket.scopevisio.com/secure/attachment/59340/59340_image-2021-12-09-18-29-39-431.png)
        
        ![https://ticket.scopevisio.com/secure/attachment/59343/59343_image-2021-12-09-18-40-40-112.png](https://ticket.scopevisio.com/secure/attachment/59343/59343_image-2021-12-09-18-40-40-112.png)
        
- ScannerÂ Auf der Scanner-Seite lÃ¤sst sich zwischen dem Scannen und dem Hochladen eines Dokuments wÃ¤hlen.
    
    ![https://ticket.scopevisio.com/secure/attachment/59341/59341_image-2021-12-09-18-30-10-272.png](https://ticket.scopevisio.com/secure/attachment/59341/59341_image-2021-12-09-18-30-10-272.png)
    
- HinzufÃ¼gen eines Dokuments bzw. Bearbeitung eines Dokuments (DocumentEdit.vue)Das HinzufÃ¼gen und das Bearbeiten eines Dokuments soll gleich aussehen. Deswegen soll die DocumentEdit.vue so programmiert werden, dass sie fÃ¼r beides verwendet wird. Zu sehen istÂ ein Bild des gescannten bzw. zu bearbeitenden Dokuments (dabei spielt es keine Rolle, welches Dateiformat das Dokument hat), der verÃ¤nderbare Belegname, das dem Dokument zugehÃ¶rige Projekt bzw. die noch auszuwÃ¤hlende Projektauswahl, die Ã¤nderbare bzw. die wÃ¤hlbare Belegart und die Ã¤nderbare bzw. wÃ¤hlbare ErstattungsfÃ¤higkeit. Man kann die DocumentEdit.vue verlassen, indem man entweder auf zurÃ¼ck klickt oder auf "Ã¼bernehmen". Bei beiden MÃ¶glichkeiten soll man je nachdem, ob man gerade ein Dokument bearbeitet oder neu hinzugefÃ¼gt hat, entweder zurÃ¼ck zur Detailansicht kommen oder zurÃ¼ck zur Scanner-Seite.
    
    ![https://ticket.scopevisio.com/secure/attachment/59344/59344_image-2021-12-09-18-45-32-733.png](https://ticket.scopevisio.com/secure/attachment/59344/59344_image-2021-12-09-18-45-32-733.png)
    
- +Einstellungen+Bei den Einstellungen sieht man oben eine kleine Ãœbersicht Ã¼ber sein Profil, darunter die MÃ¶glichkeiten die Gesellschaft zu wechseln, das Passwort zu Ã¤ndern und das Impressum anzusehen und ganz unten den Button zum Ausloggen. Klickt man auf eine der drei MÃ¶glichkeiten, wird man jeweils auf die passende Seite navigiert.
    
    ![https://ticket.scopevisio.com/secure/attachment/59342/59342_image-2021-12-09-18-31-18-090.png](https://ticket.scopevisio.com/secure/attachment/59342/59342_image-2021-12-09-18-31-18-090.png)
    

**Additional Info:**

Ich freue mich immer Ã¼ber Feedback und VerbesserungsvorschlÃ¤ge.

![https://ticket.scopevisio.com/images/icons/emoticons/smile.png](https://ticket.scopevisio.com/images/icons/emoticons/smile.png)

### Design

- Icon Font



### Roadmap

<iframe width="600" height="300" src="https://miro.com/app/live-embed/uXjVOV2Sk2M=/?moveToViewport=-860,-633,4848,3173" frameBorder="0" scrolling="no" allowFullScreen></iframe>

:::spoiler
#### ↪︎ Schritt 1:
* Login und Onboarding der App fertigstellen
* Einmaliger Login mit einem Scopevisio-Konto unter Nutzung der technischen

#### ↪︎ Schritt 2:
* - Fotografieren eines Beleges mit Bildkorrektur (Ausschnitt, Ausrichtung), alternativ auswÃ¤hlen eines Dokuments aus der Fotogalerie oder dem Dateiendienst des GerÃ¤tes

#### ↪︎ Schritt 3:
* Texterkennung mit Identifizierung von Key-Words die als Standard von Scopevisio geliefert werden und vom Unternehmen ergÃ¤nzt werden kÃ¶nnen

#### ↪︎ Schritt 4:
* Die Metainformationen anzeigen und ggf. korrigieren
* 

#### ↪︎ Schritt 4:
* ErgÃ¤nzung von Metametainformationen des Beleges um mindestens folgende Attribute:
* Belegart (Reise oder Spesen)
* Datum des Beleges, nach MÃ¶glichkeit aus dem Scannergebnis auswÃ¤hlen
* Zuordnung zu den Reisekostenkategorien â€žFahrtkosten, Ãœbernachtung, Nebenkostenâ€œ auf Basis der ausgewerteten Metadaten. Wird die Kategorie Ãœbernachtung ausgewÃ¤hlt, muss zusÃ¤tzlich hinterlegt werden ob das FrÃ¼hstÃ¼ck mit enthalten war.
* Zuordnung zu einem Scopevisioprojekt mit intelligenter Auswahl auf Basis des Datums und der Zuordnung der BenutzerIn zu einem Projekt
* Zuordnung zu einem vorhandenen Reise falls die Belegart â€žReiseâ€œ ausgewÃ¤hlt wurde
* Sollte die Belegart Spesen ausgewÃ¤hlt worden sein kÃ¶nnen Optional die Daten zu Teilnehmer und GrÃ¼nde fÃ¼r die Ausgabe erfasst werden
* Die Pflichtfelder mÃ¼ssen noch diskutiert werden

#### ↪︎ Schritt 5:
* Der Beleg wird gesichert und an die Reisekostenerfassung weitergeleitet. Art und Umfang der Weiterleitung mit Blick auf die Betadaten muss noch diskutiert werden. Eine Zwischenspeicherung ohne Ãœbermittlung muss mÃ¶glich sein.

#### ↪︎ Schritt 6:
* Der Beleg wird gesichert und an die Reisekostenerfassung weitergeleitet. Art und Umfang der Weiterleitung mit Blick auf die Betadaten muss noch diskutiert werden. Eine Zwischenspeicherung ohne Ãœbermittlung muss mÃ¶glich sein.

#### ↪︎ Option: Schritt 7:
* Bilderkennung und Verarbeitung fÃ¼r Android erstellen

## Nicole




:::




## **🗂 Bereiche**



### ↪︎ Registrierung

:::info
:::spoiler
:::

### ↪︎ Login

:::info
- Face ID
- Touch ID
:::spoiler
:::

### ↪︎ Onboarding

:::info
:::spoiler
:::

### ↪︎ Scan Maske

:::info
:::spoiler
:::

### ↪︎ Hauptmenü

:::info
:::spoiler
:::success
:::

## **⚡️Funktionen**

:::info
:::spoiler
:::success

:::


### ↪︎ Multiples Scannen

::: info
- Single Upload
- Multi Upload
::: spoiler
:::


### ↪︎ Hochladen

::: info
- Single Upload
- Multi Upload
::: spoiler
:::


### ↪︎ Scannen
::: info
::: spoiler
:::

### ↪︎ Ausschneiden, Ausrichten
::: info
::: spoiler
:::




### ↪︎ Filter

::: info
::: spoiler
:::
:::
### ↪︎ Editieren
::: info
::: spoiler



#### Klickdummy
<iframe width="100%" height=300
src="https://xd.adobe.com/embed/0bb42298-ba51-4517-4403-94f6f45220b5-7d85/screen/7ce110e2-0147-4fa6-be6f-67f834396f46" frameborder="0"></iframe>

:::

### ↪︎ Vergrößern

:::info
:::spoiler
#### Klickdummy


:::

### ↪︎ Teilen
:::info
:::spoiler
:::

### ↪︎ Speichern

:::info
:::spoiler
:::

### ↪︎ Erfassen

:::info
:::spoiler
:::

### ↪︎ Lampe

:::info
:::spoiler
:::

## **🕹Steuerung**

:::info
:::spoiler
:::

### ↪︎ Gesten

:::info
:::spoiler
:::



