diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
new file mode 100644
index 00000000000..519da2bbecf
--- /dev/null
+++ b/.github/pull_request_template.md
@@ -0,0 +1,4 @@
+# Changes
+
+# Related Issues/ PRs
+- Fixes # (issue)
diff --git a/src/main/java/seedu/ibook/logic/parser/AddCommandParser.java b/src/main/java/seedu/ibook/logic/parser/AddCommandParser.java
index 65d48a913e2..c7be2574401 100644
--- a/src/main/java/seedu/ibook/logic/parser/AddCommandParser.java
+++ b/src/main/java/seedu/ibook/logic/parser/AddCommandParser.java
@@ -34,13 +34,14 @@ public AddCommand parse(String args) throws ParseException {
             ArgumentTokenizer.tokenize(args, PREFIX_NAME, PREFIX_CATEGORY, PREFIX_EXPIRY_DATE, PREFIX_DESCRIPTION,
                 PREFIX_PRICE);
 
-        if (!arePrefixesPresent(argMultimap, PREFIX_NAME, PREFIX_CATEGORY, PREFIX_EXPIRY_DATE, PREFIX_DESCRIPTION,
+        if (!arePrefixesPresent(argMultimap, PREFIX_NAME, PREFIX_EXPIRY_DATE, PREFIX_DESCRIPTION,
             PREFIX_PRICE) || !argMultimap.getPreamble().isEmpty()) {
             throw new ParseException(String.format(MESSAGE_INVALID_COMMAND_FORMAT, AddCommand.MESSAGE_USAGE));
         }
 
         Name name = ParserUtil.parseName(argMultimap.getValue(PREFIX_NAME).get());
-        Category category = ParserUtil.parseCategory(argMultimap.getValue(PREFIX_CATEGORY).get());
+        Category category =
+            ParserUtil.parseCategory(argMultimap.getValue(PREFIX_CATEGORY).orElse(Category.DEFAULT_CATEGORY));
         ExpiryDate expiryDate = ParserUtil.parseExpiryDate(argMultimap.getValue(PREFIX_EXPIRY_DATE).get());
         Description description = ParserUtil.parseDescription(argMultimap.getValue(PREFIX_DESCRIPTION).get());
         Price price = ParserUtil.parsePrice(argMultimap.getValue(PREFIX_PRICE).get());
diff --git a/src/main/java/seedu/ibook/logic/parser/FindCommandParser.java b/src/main/java/seedu/ibook/logic/parser/FindCommandParser.java
index 8db7682deff..a2af1baa914 100644
--- a/src/main/java/seedu/ibook/logic/parser/FindCommandParser.java
+++ b/src/main/java/seedu/ibook/logic/parser/FindCommandParser.java
@@ -42,35 +42,35 @@ public FindCommand parse(String args) throws ParseException {
         if (argMultimap.getValue(PREFIX_NAME).isPresent()) {
             name = ParserUtil.parseName(argMultimap.getValue(PREFIX_NAME).get());
         } else {
-            name = Name.WILDNAME;
+            name = Name.WILD_NAME;
             wildCard--;
         }
 
         if (argMultimap.getValue(PREFIX_CATEGORY).isPresent()) {
             category = ParserUtil.parseCategory(argMultimap.getValue(PREFIX_CATEGORY).get());
         } else {
-            category = Category.WILDCATEGORY;
+            category = Category.WILD_CATEGORY;
             wildCard--;
         }
 
         if (argMultimap.getValue(PREFIX_EXPIRY_DATE).isPresent()) {
             expiryDate = ParserUtil.parseExpiryDate(argMultimap.getValue(PREFIX_EXPIRY_DATE).get());
         } else {
-            expiryDate = ExpiryDate.WILDEXPIRYDATE;
+            expiryDate = ExpiryDate.WILD_EXPIRY_DATE;
             wildCard--;
         }
 
         if (argMultimap.getValue(PREFIX_DESCRIPTION).isPresent()) {
             description = ParserUtil.parseDescription(argMultimap.getValue(PREFIX_DESCRIPTION).get());
         } else {
-            description = Description.WILDDESCRIPTION;
+            description = Description.WILD_DESCRIPTION;
             wildCard--;
         }
 
         if (argMultimap.getValue(PREFIX_PRICE).isPresent()) {
             price = ParserUtil.parsePrice(argMultimap.getValue(PREFIX_PRICE).get());
         } else {
-            price = Price.WILDPRICE;
+            price = Price.WILD_PRICE;
             wildCard--;
         }
 
diff --git a/src/main/java/seedu/ibook/model/product/Category.java b/src/main/java/seedu/ibook/model/product/Category.java
index af0c4d90843..d620d45770d 100644
--- a/src/main/java/seedu/ibook/model/product/Category.java
+++ b/src/main/java/seedu/ibook/model/product/Category.java
@@ -9,19 +9,14 @@
  */
 public class Category {
 
-    private static class WildCategory extends Category {
-        private WildCategory() {};
-
+    public static final Category WILD_CATEGORY = new Category() {
         @Override
         public boolean equals(Object other) {
-            if (other instanceof Category) {
-                return true;
-            } else {
-                return false;
-            }
+            return other instanceof Category;
         }
-    }
-    public static final WildCategory WILDCATEGORY = new WildCategory();
+    };
+
+    public static final String DEFAULT_CATEGORY = "Miscellaneous";
 
     public static final String MESSAGE_CONSTRAINTS =
             "Categories (if given) should only contain alphanumeric characters and spaces";
@@ -38,7 +33,7 @@ public boolean equals(Object other) {
      * Constructs a {@code Category} representing no categorization.
      */
     private Category() {
-        fullCategoryName = "";
+        fullCategoryName = DEFAULT_CATEGORY;
     }
 
     /**
@@ -53,7 +48,10 @@ public Category(String categoryName) {
     }
 
     /**
-     * Returns true if a given string is a valid category name.
+     * Checks if the string is valid as per {@code VALIDATION_REGEX}.
+     *
+     * @param test String to test.
+     * @return Result of test.
      */
     public static boolean isValidCategoryName(String test) {
         return test.matches(VALIDATION_REGEX);
diff --git a/src/main/java/seedu/ibook/model/product/Description.java b/src/main/java/seedu/ibook/model/product/Description.java
index 64504904fd7..0ffca99de07 100644
--- a/src/main/java/seedu/ibook/model/product/Description.java
+++ b/src/main/java/seedu/ibook/model/product/Description.java
@@ -9,19 +9,13 @@
  */
 public class Description {
 
-    private static class WildDescription extends Description {
-        private WildDescription() {};
-
+    public static final Description WILD_DESCRIPTION = new Description() {
         @Override
         public boolean equals(Object other) {
-            if (other instanceof Description) {
-                return true;
-            } else {
-                return false;
-            }
+            return other instanceof Description;
         }
-    }
-    public static final WildDescription WILDDESCRIPTION = new WildDescription();
+    };
+
     public static final String MESSAGE_CONSTRAINTS =
             "Descriptions should only contain alphanumeric characters and spaces";
 
@@ -35,7 +29,7 @@ public boolean equals(Object other) {
 
     private Description() {
         fullDescription = "???";
-    };
+    }
 
     /**
      * Constructs a {@code Description}.
@@ -49,7 +43,10 @@ public Description(String description) {
     }
 
     /**
-     * Returns true if a given string is a valid description.
+     * Checks if the string is valid as per {@code VALIDATION_REGEX}.
+     *
+     * @param test String to test.
+     * @return Result of test.
      */
     public static boolean isValidDescription(String test) {
         return test.matches(VALIDATION_REGEX);
diff --git a/src/main/java/seedu/ibook/model/product/ExpiryDate.java b/src/main/java/seedu/ibook/model/product/ExpiryDate.java
index 39b63dd9053..1e1e9041a47 100644
--- a/src/main/java/seedu/ibook/model/product/ExpiryDate.java
+++ b/src/main/java/seedu/ibook/model/product/ExpiryDate.java
@@ -14,20 +14,12 @@
  */
 public class ExpiryDate {
 
-    private static class WildExpiryDate extends ExpiryDate {
-        private WildExpiryDate() {};
-
+    public static final ExpiryDate WILD_EXPIRY_DATE = new ExpiryDate() {
         @Override
         public boolean equals(Object other) {
-            if (other instanceof ExpiryDate) {
-                return true;
-            } else {
-                return false;
-            }
+            return other instanceof ExpiryDate;
         }
-    }
-
-    public static final WildExpiryDate WILDEXPIRYDATE = new WildExpiryDate();
+    };
 
     public static final String MESSAGE_CONSTRAINTS =
             "Expiry dates should have format such as 03 May 2022, 3 May 2022 or 2022-05-03";
@@ -62,7 +54,10 @@ public ExpiryDate(String date) {
     }
 
     /**
-     * Returns true if a given {@code LocalDate} is a valid expiry date.
+     * Checks if a given {@code LocalDate} is valid as per {@code VALIDATION_REGEX}.
+     *
+     * @param expiryDate Date to test.
+     * @return Result of test.
      */
     public static boolean isValidExpiryDate(String expiryDate) {
         return Arrays.stream(ACCEPTED_FORMATS)
diff --git a/src/main/java/seedu/ibook/model/product/Name.java b/src/main/java/seedu/ibook/model/product/Name.java
index 1977050a921..4ec3f50388b 100644
--- a/src/main/java/seedu/ibook/model/product/Name.java
+++ b/src/main/java/seedu/ibook/model/product/Name.java
@@ -9,21 +9,12 @@
  */
 public class Name {
 
-    private static class WildName extends Name {
-        private WildName() {};
-
+    public static final Name WILD_NAME = new Name() {
         @Override
         public boolean equals(Object other) {
-            if (other instanceof Name) {
-                return true;
-            } else {
-                return false;
-            }
+            return other instanceof Name;
         }
-
-    }
-
-    public static final WildName WILDNAME = new WildName();
+    };
 
     public static final String MESSAGE_CONSTRAINTS =
             "Names should only contain alphanumeric characters and spaces, and it should not be blank";
@@ -36,8 +27,6 @@ public boolean equals(Object other) {
 
     public final String fullName;
 
-
-
     private Name() {
         fullName = "???";
     }
@@ -54,7 +43,10 @@ public Name(String name) {
     }
 
     /**
-     * Returns true if a given string is a valid name.
+     * Checks if the string is valid as per {@code VALIDATION_REGEX}.
+     *
+     * @param test String to test.
+     * @return Result of test.
      */
     public static boolean isValidName(String test) {
         return test.matches(VALIDATION_REGEX);
diff --git a/src/main/java/seedu/ibook/model/product/Price.java b/src/main/java/seedu/ibook/model/product/Price.java
index b15d0b999ec..a297e65b216 100644
--- a/src/main/java/seedu/ibook/model/product/Price.java
+++ b/src/main/java/seedu/ibook/model/product/Price.java
@@ -9,21 +9,13 @@
  */
 public class Price {
 
-    private static class WildPrice extends Price {
-        private WildPrice() {};
-
+    public static final Price WILD_PRICE = new Price() {
         @Override
         public boolean equals(Object other) {
-            if (other instanceof Price) {
-                return true;
-            } else {
-                return false;
-            }
+            return other instanceof Price;
         }
+    };
 
-    }
-
-    public static final WildPrice WILDPRICE = new WildPrice();
     public static final String MESSAGE_CONSTRAINTS =
             "Prices should only be of type double, and should not be negative";
 
@@ -31,7 +23,7 @@ public boolean equals(Object other) {
      * The first character of the name must not be a whitespace,
      * otherwise " " (a blank string) becomes a valid input.
      */
-    public static final String VALIDATION_REGEX = "\\d+(?:.\\d{1,2})?";
+    public static final String VALIDATION_REGEX = "\\$?(\\d+(?:.\\d{1,2})?)";
 
     public final Double price;
 
@@ -47,16 +39,34 @@ private Price() {
     public Price(String price) {
         requireNonNull(price);
         checkArgument(isValidPrice(price), MESSAGE_CONSTRAINTS);
+
+        price = removeDollarSign(price);
         this.price = Double.parseDouble(price);
     }
 
     /**
-     * Returns true if a given string is a valid price.
+     * Checks if the string is valid as per {@code VALIDATION_REGEX}.
+     *
+     * @param test String to test.
+     * @return Result of test.
      */
     public static boolean isValidPrice(String test) {
         return test.matches(VALIDATION_REGEX);
     }
 
+    /**
+     * Removes "$" sign (if any) from a price string.
+     *
+     * @param price Price string.
+     * @return Price string with "$" sign removed (if any).
+     */
+    private String removeDollarSign(String price) {
+        if (price.startsWith("$")) {
+            return price.substring(1);
+        }
+
+        return price;
+    }
 
     @Override
     public String toString() {
diff --git a/src/main/java/seedu/ibook/model/tag/Tag.java b/src/main/java/seedu/ibook/model/tag/Tag.java
deleted file mode 100644
index 679298b40e9..00000000000
--- a/src/main/java/seedu/ibook/model/tag/Tag.java
+++ /dev/null
@@ -1,54 +0,0 @@
-package seedu.ibook.model.tag;
-
-import static java.util.Objects.requireNonNull;
-import static seedu.ibook.commons.util.AppUtil.checkArgument;
-
-/**
- * Represents a Tag in the ibook.
- * Guarantees: immutable; name is valid as declared in {@link #isValidTagName(String)}
- */
-public class Tag {
-
-    public static final String MESSAGE_CONSTRAINTS = "Tags names should be alphanumeric";
-    public static final String VALIDATION_REGEX = "\\p{Alnum}+";
-
-    public final String tagName;
-
-    /**
-     * Constructs a {@code Tag}.
-     *
-     * @param tagName A valid tag name.
-     */
-    public Tag(String tagName) {
-        requireNonNull(tagName);
-        checkArgument(isValidTagName(tagName), MESSAGE_CONSTRAINTS);
-        this.tagName = tagName;
-    }
-
-    /**
-     * Returns true if a given string is a valid tag name.
-     */
-    public static boolean isValidTagName(String test) {
-        return test.matches(VALIDATION_REGEX);
-    }
-
-    @Override
-    public boolean equals(Object other) {
-        return other == this // short circuit if same object
-                || (other instanceof Tag // instanceof handles nulls
-                && tagName.equals(((Tag) other).tagName)); // state check
-    }
-
-    @Override
-    public int hashCode() {
-        return tagName.hashCode();
-    }
-
-    /**
-     * Format state as text for viewing.
-     */
-    public String toString() {
-        return '[' + tagName + ']';
-    }
-
-}
diff --git a/src/main/java/seedu/ibook/model/util/SampleDataUtil.java b/src/main/java/seedu/ibook/model/util/SampleDataUtil.java
index 5a6fa58195f..70727ab91bd 100644
--- a/src/main/java/seedu/ibook/model/util/SampleDataUtil.java
+++ b/src/main/java/seedu/ibook/model/util/SampleDataUtil.java
@@ -1,9 +1,5 @@
 package seedu.ibook.model.util;
 
-import java.util.Arrays;
-import java.util.Set;
-import java.util.stream.Collectors;
-
 import seedu.ibook.model.IBook;
 import seedu.ibook.model.ReadOnlyIBook;
 import seedu.ibook.model.product.Category;
@@ -12,7 +8,6 @@
 import seedu.ibook.model.product.Name;
 import seedu.ibook.model.product.Price;
 import seedu.ibook.model.product.Product;
-import seedu.ibook.model.tag.Tag;
 
 /**
  * Contains utility methods for populating {@code AddressBook} with sample data.
@@ -26,15 +21,6 @@ public static Product[] getSampleProducts() {
         };
     }
 
-    /**
-     * Returns a tag set containing the list of strings given.
-     */
-    public static Set<Tag> getTagSet(String... strings) {
-        return Arrays.stream(strings)
-            .map(Tag::new)
-            .collect(Collectors.toSet());
-    }
-
     public static ReadOnlyIBook getSampleIBook() {
         IBook sampleIb = new IBook();
         for (Product sampleProduct : getSampleProducts()) {
diff --git a/src/main/java/seedu/ibook/storage/JsonAdaptedTag.java b/src/main/java/seedu/ibook/storage/JsonAdaptedTag.java
deleted file mode 100644
index 26c104d708d..00000000000
--- a/src/main/java/seedu/ibook/storage/JsonAdaptedTag.java
+++ /dev/null
@@ -1,48 +0,0 @@
-package seedu.ibook.storage;
-
-import com.fasterxml.jackson.annotation.JsonCreator;
-import com.fasterxml.jackson.annotation.JsonValue;
-
-import seedu.ibook.commons.exceptions.IllegalValueException;
-import seedu.ibook.model.tag.Tag;
-
-/**
- * Jackson-friendly version of {@link Tag}.
- */
-class JsonAdaptedTag {
-
-    private final String tagName;
-
-    /**
-     * Constructs a {@code JsonAdaptedTag} with the given {@code tagName}.
-     */
-    @JsonCreator
-    public JsonAdaptedTag(String tagName) {
-        this.tagName = tagName;
-    }
-
-    /**
-     * Converts a given {@code Tag} into this class for Jackson use.
-     */
-    public JsonAdaptedTag(Tag source) {
-        tagName = source.tagName;
-    }
-
-    @JsonValue
-    public String getTagName() {
-        return tagName;
-    }
-
-    /**
-     * Converts this Jackson-friendly adapted tag object into the model's {@code Tag} object.
-     *
-     * @throws IllegalValueException if there were any data constraints violated in the adapted tag.
-     */
-    public Tag toModelType() throws IllegalValueException {
-        if (!Tag.isValidTagName(tagName)) {
-            throw new IllegalValueException(Tag.MESSAGE_CONSTRAINTS);
-        }
-        return new Tag(tagName);
-    }
-
-}
diff --git a/src/main/java/seedu/ibook/ui/CommandBox.java b/src/main/java/seedu/ibook/ui/CommandBox.java
index 97a9ad63dce..e648ea559e2 100644
--- a/src/main/java/seedu/ibook/ui/CommandBox.java
+++ b/src/main/java/seedu/ibook/ui/CommandBox.java
@@ -4,25 +4,28 @@
 import javafx.scene.control.TextField;
 import javafx.scene.layout.HBox;
 
-public class CommandBox extends UiPart<HBox> {
+/**
+ * CommandBox Ui class.
+ */
+public class CommandBox extends UiComponent<HBox> {
 
     private static final String FXML = "CommandBox.fxml";
 
-    private final CommandExecutor commandExecutor;
-
     @FXML
     private TextField commandTextField;
 
     /**
-     * Creates a {@code CommandBox} with the given {@code CommandExecutor}.
+     * Creates a {@code CommandBox} with a {@code CommandExecutor}
+     * and a {@code popupAdd}.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
      */
-    public CommandBox(CommandExecutor commandExecutor) {
-        super(FXML);
-        this.commandExecutor = commandExecutor;
+    public CommandBox(MainWindow mainWindow) {
+        super(FXML, mainWindow);
     }
 
     /**
-     * Handles the Enter button pressed event.
+     * Handles the Enter button pressed event in the command line.
      */
     @FXML
     private void handleCommandEntered() {
@@ -31,20 +34,16 @@ private void handleCommandEntered() {
             return;
         }
 
-        commandExecutor.execute(commandText);
+        getMainWindow().executeCommand(commandText);
         commandTextField.setText("");
     }
 
     /**
-     * Represents a function that can execute commands.
+     * Handles the add product button clicked event.
      */
-    @FunctionalInterface
-    public interface CommandExecutor {
-        /**
-         * Executes the command and returns the result.
-         *
-         * @see seedu.ibook.logic.Logic#execute(String)
-         */
-        void execute(String commandText);
+    @FXML
+    private void handleAddProductClicked() {
+        getMainWindow().showPopupAdd();
     }
+
 }
diff --git a/src/main/java/seedu/ibook/ui/MainWindow.java b/src/main/java/seedu/ibook/ui/MainWindow.java
index 5ad4170f344..6aba53eeec8 100644
--- a/src/main/java/seedu/ibook/ui/MainWindow.java
+++ b/src/main/java/seedu/ibook/ui/MainWindow.java
@@ -12,6 +12,9 @@
 import seedu.ibook.logic.commands.CommandResult;
 import seedu.ibook.logic.commands.exceptions.CommandException;
 import seedu.ibook.logic.parser.exceptions.ParseException;
+import seedu.ibook.model.product.Product;
+import seedu.ibook.ui.popup.PopupHandler;
+import seedu.ibook.ui.table.Table;
 
 /**
  * The Main Window. Provides the basic application layout containing
@@ -31,11 +34,16 @@ public class MainWindow extends UiPart<Stage> {
     private ResultWindow resultWindow;
     private Table table;
 
+    private PopupHandler popupHandler;
+
     @FXML
     private VBox mainContent;
 
     /**
-     * Creates a {@code MainWindow} with the given {@code Stage} and {@code Logic}.
+     * Initializes a {@code MainWindow}.
+     *
+     * @param primaryStage The {@code Stage} of the application.
+     * @param logic The main code {@code Logic}.
      */
     public MainWindow(Stage primaryStage, Logic logic) {
         super(FXML, primaryStage);
@@ -45,6 +53,9 @@ public MainWindow(Stage primaryStage, Logic logic) {
         this.logic = logic;
     }
 
+    /**
+     * Shows the stage.
+     */
     void show() {
         primaryStage.show();
     }
@@ -57,26 +68,32 @@ private void handleExit() {
         primaryStage.hide();
     }
 
+    /**
+     * Gets the primary stage.
+     * @return The primary stage.
+     */
     Stage getPrimaryStage() {
         return primaryStage;
     }
 
     /**
-     * Fills up all the placeholders of this window.
+     * Fills up the inner part of this window.
      */
     void fillInnerParts() {
         ObservableList<Node> children = mainContent.getChildren();
 
-        menuToolbar = new MenuToolbar();
+        popupHandler = new PopupHandler(this);
+
+        menuToolbar = new MenuToolbar(this);
         children.add(menuToolbar.getRoot());
 
-        commandBox = new CommandBox(this::executeCommand);
+        commandBox = new CommandBox(this);
         children.add(commandBox.getRoot());
 
-        resultWindow = new ResultWindow();
+        resultWindow = new ResultWindow(this);
         children.add(resultWindow.getRoot());
 
-        table = new Table(logic.getFilteredIBook());
+        table = new Table(this);
         children.add(table.getRoot());
     }
 
@@ -85,7 +102,7 @@ void fillInnerParts() {
      *
      * @see seedu.ibook.logic.Logic#execute(String)
      */
-    private void executeCommand(String commandText) {
+    public void executeCommand(String commandText) {
         try {
             CommandResult commandResult = logic.execute(commandText);
             logger.info("Result: " + commandResult.getFeedbackToUser());
@@ -94,10 +111,52 @@ private void executeCommand(String commandText) {
             if (commandResult.isExit()) {
                 handleExit();
             }
-
+            hidePopup();
         } catch (CommandException | ParseException e) {
             logger.info("Invalid command: " + commandText);
-            resultWindow.setFeedbackToUser(e.getMessage());
+            setError(e.getMessage());
+        }
+    }
+
+    /**
+     * Shows the popup window for adding product.
+     */
+    public void showPopupAdd() {
+        popupHandler.showPopupAdd();
+    }
+
+    /**
+     * Shows the popup window for updating product.
+     */
+    public void showPopupUpdate(int index, Product product) {
+        popupHandler.showPopupUpdate(index, product);
+    }
+
+    /**
+     * Shows the popup window for deleting product.
+     */
+    public void showPopupDelete(int index, Product product) {
+        popupHandler.showPopupDelete(index, product);
+    }
+
+    /**
+     * Gets the filtered list of {@code Product} from {@code Logic}.
+     *
+     * @return Get a filtered list of {@code Product}.
+     */
+    public ObservableList<Product> getFilteredIBook() {
+        return logic.getFilteredIBook();
+    }
+
+    private void hidePopup() {
+        popupHandler.hidePopup();
+    }
+
+    private void setError(String message) {
+        if (popupHandler.isShowing()) {
+            popupHandler.setFeedbackToUser(message);
+        } else {
+            resultWindow.setFeedbackToUser(message);
         }
     }
 }
diff --git a/src/main/java/seedu/ibook/ui/MenuToolbar.java b/src/main/java/seedu/ibook/ui/MenuToolbar.java
index 0e14a919ab7..75f14abea79 100644
--- a/src/main/java/seedu/ibook/ui/MenuToolbar.java
+++ b/src/main/java/seedu/ibook/ui/MenuToolbar.java
@@ -2,12 +2,20 @@
 
 import javafx.scene.control.MenuBar;
 
-public class MenuToolbar extends UiPart<MenuBar> {
+/**
+ * The menu toolbar of the application.
+ */
+public class MenuToolbar extends UiComponent<MenuBar> {
 
     private static final String FXML = "MenuToolbar.fxml";
 
-    MenuToolbar() {
-        super(FXML);
+    /**
+     * Initializes a {@code MenuToolbar}.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    MenuToolbar(MainWindow mainWindow) {
+        super(FXML, mainWindow);
     }
 
 }
diff --git a/src/main/java/seedu/ibook/ui/ProductCard.java b/src/main/java/seedu/ibook/ui/ProductCard.java
deleted file mode 100644
index 80a8a073805..00000000000
--- a/src/main/java/seedu/ibook/ui/ProductCard.java
+++ /dev/null
@@ -1,47 +0,0 @@
-package seedu.ibook.ui;
-
-import javafx.fxml.FXML;
-import javafx.scene.control.Label;
-import javafx.scene.layout.HBox;
-import seedu.ibook.model.product.Product;
-
-public class ProductCard extends UiPart<HBox> {
-
-    private static final String FXML = "ProductCard.fxml";
-
-    private final int id;
-    private final Product product;
-
-    @FXML
-    private Label index;
-    @FXML
-    private Label name;
-    @FXML
-    private Label category;
-    @FXML
-    private Label expiryDate;
-    @FXML
-    private Label price;
-    @FXML
-    private Label description;
-
-    @FXML
-    private HBox action;
-
-    ProductCard(int index, Product product) {
-        super(FXML);
-        this.id = index;
-        this.product = product;
-        populateField();
-    }
-
-    void populateField() {
-        index.setText(String.valueOf(id));
-        name.setText(product.getName().toString());
-        category.setText(product.getCategory().toString());
-        expiryDate.setText(product.getExpiryDate().toString());
-        price.setText(product.getPrice().toString());
-        description.setText(product.getDescription().toString());
-    }
-
-}
diff --git a/src/main/java/seedu/ibook/ui/ResultWindow.java b/src/main/java/seedu/ibook/ui/ResultWindow.java
index 7940ac84269..b5779e745e7 100644
--- a/src/main/java/seedu/ibook/ui/ResultWindow.java
+++ b/src/main/java/seedu/ibook/ui/ResultWindow.java
@@ -2,23 +2,32 @@
 
 import static java.util.Objects.requireNonNull;
 
-import javafx.fxml.FXML;
 import javafx.scene.control.TextArea;
 
-public class ResultWindow extends UiPart<TextArea> {
+/**
+ * The window that shows feedback of a command.
+ */
+public class ResultWindow extends UiComponent<TextArea> {
 
     private static final String FXML = "ResultWindow.fxml";
 
-    @FXML
-    private TextArea resultDisplay;
-
-    ResultWindow() {
-        super(FXML);
+    /**
+     * Initializes a {@code ResultWindow}.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    ResultWindow(MainWindow mainWindow) {
+        super(FXML, mainWindow);
     }
 
+    /**
+     * Shows the feedback of a command to user.
+     *
+     * @param feedbackToUser The feedback of a command.
+     */
     void setFeedbackToUser(String feedbackToUser) {
         requireNonNull(feedbackToUser);
-        resultDisplay.setText(feedbackToUser);
+        getRoot().setText(feedbackToUser);
     }
 
 }
diff --git a/src/main/java/seedu/ibook/ui/Table.java b/src/main/java/seedu/ibook/ui/Table.java
deleted file mode 100644
index 76dafd33f4d..00000000000
--- a/src/main/java/seedu/ibook/ui/Table.java
+++ /dev/null
@@ -1,32 +0,0 @@
-package seedu.ibook.ui;
-
-import javafx.collections.ObservableList;
-import javafx.scene.Node;
-import javafx.scene.layout.VBox;
-import seedu.ibook.model.product.Product;
-
-public class Table extends UiPart<VBox> {
-
-    private static final String FXML = "Table.fxml";
-
-    private TableHeader tableHeader;
-    private TableContent tableContent;
-
-    private final ObservableList<Product> filteredIBook;
-
-    Table(ObservableList<Product> filteredIBook) {
-        super(FXML);
-        this.filteredIBook = filteredIBook;
-        populateField();
-    }
-
-    void populateField() {
-        ObservableList<Node> children = getRoot().getChildren();
-
-        tableHeader = new TableHeader();
-        children.add(tableHeader.getRoot());
-
-        tableContent = new TableContent(filteredIBook);
-        children.add(tableContent.getRoot());
-    }
-}
diff --git a/src/main/java/seedu/ibook/ui/TableHeader.java b/src/main/java/seedu/ibook/ui/TableHeader.java
deleted file mode 100644
index cfaec14ea61..00000000000
--- a/src/main/java/seedu/ibook/ui/TableHeader.java
+++ /dev/null
@@ -1,12 +0,0 @@
-package seedu.ibook.ui;
-
-import javafx.scene.layout.HBox;
-
-public class TableHeader extends UiPart<HBox> {
-
-    private static final String FXML = "TableHeader.fxml";
-
-    TableHeader() {
-        super(FXML);
-    }
-}
diff --git a/src/main/java/seedu/ibook/ui/UiComponent.java b/src/main/java/seedu/ibook/ui/UiComponent.java
new file mode 100644
index 00000000000..5a7cd8c862b
--- /dev/null
+++ b/src/main/java/seedu/ibook/ui/UiComponent.java
@@ -0,0 +1,38 @@
+package seedu.ibook.ui;
+
+public abstract class UiComponent<T> extends UiPart<T> {
+
+    private final MainWindow mainWindow;
+
+    /**
+     * Initializes a new UiComponent.
+     *
+     * @param filePath The filepath of the FXML file.
+     * @param mainWindow The Main Window that this component resides on.
+     */
+    public UiComponent(String filePath, MainWindow mainWindow) {
+        super(filePath);
+        this.mainWindow = mainWindow;
+    }
+
+    /**
+     * Initializes a new UiComponent with a root object
+     *
+     * @param filePath The filepath of the FXML file.
+     * @param mainWindow The Main Window that this component resides on.
+     * @param stage the root object
+     */
+    public UiComponent(String filePath, MainWindow mainWindow, T stage) {
+        super(filePath, stage);
+        this.mainWindow = mainWindow;
+    }
+
+    /**
+     * Get the {@code MainWindow}.
+     *
+     * @return The {@code MainWindow} that this component resides on.
+     */
+    public MainWindow getMainWindow() {
+        return this.mainWindow;
+    }
+}
diff --git a/src/main/java/seedu/ibook/ui/UiManager.java b/src/main/java/seedu/ibook/ui/UiManager.java
index 7395b772430..2bb2e75d632 100644
--- a/src/main/java/seedu/ibook/ui/UiManager.java
+++ b/src/main/java/seedu/ibook/ui/UiManager.java
@@ -27,7 +27,9 @@ public class UiManager implements Ui {
     private MainWindow mainWindow;
 
     /**
-     * Creates a {@code UiManager} with the given {@code Logic}.
+     * Initializes a {@code UiManager}.
+     *
+     * @param logic The application {@code Logic}.
      */
     public UiManager(Logic logic) {
         this.logic = logic;
@@ -60,6 +62,8 @@ private Image getIcon() {
     /**
      * Shows an error alert dialog with {@code title} and error message, {@code e},
      * and exits the application after the user has closed the alert dialog.
+     *
+     * @param e The error
      */
     private void showFatalErrorDialogAndShutdown(Throwable e) {
         logger.severe(UiManager.FATAL_ERROR_MESSAGE
diff --git a/src/main/java/seedu/ibook/ui/UiPart.java b/src/main/java/seedu/ibook/ui/UiPart.java
index 4139035ba5f..5f7168d7fc7 100644
--- a/src/main/java/seedu/ibook/ui/UiPart.java
+++ b/src/main/java/seedu/ibook/ui/UiPart.java
@@ -22,6 +22,8 @@ public abstract class UiPart<T> {
     /**
      * Constructs a UiPart with the specified FXML file URL.
      * The FXML file must not specify the {@code fx:controller} attribute.
+     *
+     * @param fxmlFileUrl The url of fxml.
      */
     public UiPart(URL fxmlFileUrl) {
         loadFxmlFile(fxmlFileUrl, null);
@@ -29,6 +31,9 @@ public UiPart(URL fxmlFileUrl) {
 
     /**
      * Constructs a UiPart using the specified FXML file within {@link #FXML_FILE_FOLDER}.
+     *
+     * @param fxmlFileName The file name of fxml.
+     *
      * @see #UiPart(URL)
      */
     public UiPart(String fxmlFileName) {
@@ -38,6 +43,9 @@ public UiPart(String fxmlFileName) {
     /**
      * Constructs a UiPart with the specified FXML file URL and root object.
      * The FXML file must not specify the {@code fx:controller} attribute.
+     *
+     * @param fxmlFileUrl The url of fxml.
+     * @param root The root of the scene.
      */
     public UiPart(URL fxmlFileUrl, T root) {
         loadFxmlFile(fxmlFileUrl, root);
@@ -45,6 +53,10 @@ public UiPart(URL fxmlFileUrl, T root) {
 
     /**
      * Constructs a UiPart with the specified FXML file within {@link #FXML_FILE_FOLDER} and root object.
+     *
+     * @param fxmlFileName The file name of fxml.
+     * @param root The root of the scene.
+     *
      * @see #UiPart(URL, T)
      */
     public UiPart(String fxmlFileName, T root) {
@@ -53,6 +65,8 @@ public UiPart(String fxmlFileName, T root) {
 
     /**
      * Returns the root object of the scene graph of this UiPart.
+     *
+     * @return The root of the scene.
      */
     public T getRoot() {
         return fxmlLoader.getRoot();
@@ -60,6 +74,7 @@ public T getRoot() {
 
     /**
      * Loads the object hierarchy from a FXML document.
+     *
      * @param location Location of the FXML document.
      * @param root Specifies the root of the object hierarchy.
      */
diff --git a/src/main/java/seedu/ibook/ui/popup/Popup.java b/src/main/java/seedu/ibook/ui/popup/Popup.java
new file mode 100644
index 00000000000..4d2a3a2502b
--- /dev/null
+++ b/src/main/java/seedu/ibook/ui/popup/Popup.java
@@ -0,0 +1,89 @@
+package seedu.ibook.ui.popup;
+
+import static java.util.Objects.requireNonNull;
+
+import javafx.fxml.FXML;
+import javafx.scene.text.Text;
+import javafx.stage.Stage;
+import seedu.ibook.ui.MainWindow;
+import seedu.ibook.ui.UiComponent;
+
+/**
+ * Abstract Class representing the skeleton of a popup.
+ */
+public abstract class Popup extends UiComponent<Stage> {
+
+    @FXML
+    private Text error;
+
+    /**
+     * Initializes a new popup window with a {@code FXML} file path
+     * and a {@code CommandExecutor}.
+     *
+     * @param filePath FXML filepath.
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    Popup(String filePath, MainWindow mainWindow) {
+        super(filePath, mainWindow, new Stage());
+    }
+
+    /**
+     * Shows the popup window.
+     */
+    public void show() {
+        getRoot().show();
+        error.setText("");
+    }
+
+    /**
+     * Hides the popup window.
+     */
+    public void hide() {
+        getRoot().hide();
+    }
+
+    /**
+     * Checks if the popup is showing.
+     *
+     * @return A boolean indicating if the popup is showing.
+     */
+    public boolean isShowing() {
+        return getRoot().isShowing();
+    }
+
+    /**
+     * Hides the popup if it is showing.
+     */
+    public void hideIfShowing() {
+        if (isShowing()) {
+            hide();
+        }
+    }
+
+    /**
+     * Focuses the popup window.
+     */
+    public void focus() {
+        getRoot().requestFocus();
+    }
+
+    /**
+     * Shows feedback to user.
+     *
+     * @param feedbackToUser The feedback string.
+     */
+    public void setFeedbackToUser(String feedbackToUser) {
+        requireNonNull(feedbackToUser);
+        error.setText(feedbackToUser);
+    }
+
+    /**
+     * Executes the commandText with the {@code commandExecutor}.
+     *
+     * @param commandText The commandText.
+     */
+    void execute(String commandText) {
+        getMainWindow().executeCommand(commandText);
+    }
+
+}
diff --git a/src/main/java/seedu/ibook/ui/popup/PopupAdd.java b/src/main/java/seedu/ibook/ui/popup/PopupAdd.java
new file mode 100644
index 00000000000..795b0f57c26
--- /dev/null
+++ b/src/main/java/seedu/ibook/ui/popup/PopupAdd.java
@@ -0,0 +1,54 @@
+package seedu.ibook.ui.popup;
+
+import javafx.fxml.FXML;
+import javafx.scene.control.TextArea;
+import javafx.scene.control.TextField;
+import seedu.ibook.logic.commands.AddCommand;
+import seedu.ibook.logic.parser.CliSyntax;
+import seedu.ibook.ui.MainWindow;
+
+/**
+ * Popup responsible to add product.
+ */
+public class PopupAdd extends Popup {
+
+    private static final String FXML = "popup/PopupAdd.fxml";
+
+    @FXML
+    private TextField name;
+    @FXML
+    private TextField category;
+    @FXML
+    private TextField expiryDate;
+    @FXML
+    private TextField price;
+    @FXML
+    private TextArea description;
+
+    /**
+     * Initializes a new {@code popupAdd} window.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    public PopupAdd(MainWindow mainWindow) {
+        super(FXML, mainWindow);
+    }
+
+    @FXML
+    private void handleCreateProduct() {
+        String commandText = AddCommand.COMMAND_WORD
+                + " " + CliSyntax.PREFIX_NAME.getPrefix()
+                + name.getText()
+                + " " + CliSyntax.PREFIX_CATEGORY.getPrefix()
+                + category.getText()
+                + " " + CliSyntax.PREFIX_EXPIRY_DATE.getPrefix()
+                + expiryDate.getText()
+                + " " + CliSyntax.PREFIX_PRICE.getPrefix()
+                + price.getText()
+                + " " + CliSyntax.PREFIX_DESCRIPTION.getPrefix()
+                + description.getText();
+
+        execute(commandText);
+    }
+
+}
diff --git a/src/main/java/seedu/ibook/ui/popup/PopupDelete.java b/src/main/java/seedu/ibook/ui/popup/PopupDelete.java
new file mode 100644
index 00000000000..b8441b8c4db
--- /dev/null
+++ b/src/main/java/seedu/ibook/ui/popup/PopupDelete.java
@@ -0,0 +1,47 @@
+package seedu.ibook.ui.popup;
+
+import javafx.fxml.FXML;
+import javafx.scene.control.Label;
+import seedu.ibook.logic.commands.DeleteCommand;
+import seedu.ibook.model.product.Product;
+import seedu.ibook.ui.MainWindow;
+
+/**
+ * Popup responsible to delete product.
+ */
+public class PopupDelete extends Popup {
+
+    private static final String FXML = "popup/PopupDelete.fxml";
+
+    private int index;
+
+    @FXML
+    private Label message;
+
+    /**
+     * Initializes a new {@code popupDelete} window.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    public PopupDelete(MainWindow mainWindow) {
+        super(FXML, mainWindow);
+    }
+
+    /**
+     * Shows the popup window.
+     *
+     * @param index Index of the product.
+     * @param product The product to be deleted.
+     */
+    public void show(int index, Product product) {
+        super.show();
+        this.index = index;
+        message.setText("Are you sure you want to delete " + product.getName() + "?");
+    }
+
+    @FXML
+    private void handleDeleteProduct() {
+        String commandText = DeleteCommand.COMMAND_WORD + " " + index;
+        execute(commandText);
+    }
+}
diff --git a/src/main/java/seedu/ibook/ui/popup/PopupHandler.java b/src/main/java/seedu/ibook/ui/popup/PopupHandler.java
new file mode 100644
index 00000000000..4f2300aca83
--- /dev/null
+++ b/src/main/java/seedu/ibook/ui/popup/PopupHandler.java
@@ -0,0 +1,84 @@
+package seedu.ibook.ui.popup;
+
+import seedu.ibook.model.product.Product;
+import seedu.ibook.ui.MainWindow;
+
+public class PopupHandler {
+
+    private final PopupAdd popupAdd;
+    private final PopupUpdate popupUpdate;
+    private final PopupDelete popupDelete;
+
+    /**
+     * Initializes a {@code PopupHandler}.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    public PopupHandler(MainWindow mainWindow) {
+        popupAdd = new PopupAdd(mainWindow);
+        popupUpdate = new PopupUpdate(mainWindow);
+        popupDelete = new PopupDelete(mainWindow);
+    }
+
+    /**
+     * Checks whether a popup is showing.
+     *
+     * @return True if a popup is showing, else false.
+     */
+    public boolean isShowing() {
+        return popupAdd.isShowing()
+                || popupUpdate.isShowing()
+                || popupDelete.isShowing();
+    }
+
+    /**
+     * Shows a feedback message to the user in the popup.
+     *
+     * @param message The feedback.
+     */
+    public void setFeedbackToUser(String message) {
+        if (popupAdd.isShowing()) {
+            popupAdd.setFeedbackToUser(message);
+        } else if (popupUpdate.isShowing()) {
+            popupUpdate.setFeedbackToUser(message);
+        } else if (popupDelete.isShowing()) {
+            popupDelete.setFeedbackToUser(message);
+        }
+    }
+
+    /**
+     * Show the popup window for adding product.
+     */
+    public void showPopupAdd() {
+        if (popupAdd.isShowing()) {
+            popupAdd.focus();
+        } else {
+            popupAdd.show();
+        }
+    }
+
+    /**
+     * Shows the popup window for updating product.
+     */
+    public void showPopupUpdate(int index, Product product) {
+        popupUpdate.hideIfShowing();
+        popupUpdate.show(index, product);
+    }
+
+    /**
+     * Shows the popup window for deleting product.
+     */
+    public void showPopupDelete(int index, Product product) {
+        popupDelete.hideIfShowing();
+        popupDelete.show(index, product);
+    }
+
+    /**
+     * Hides the popup window.
+     */
+    public void hidePopup() {
+        popupAdd.hideIfShowing();
+        popupUpdate.hideIfShowing();
+        popupDelete.hideIfShowing();
+    }
+}
diff --git a/src/main/java/seedu/ibook/ui/popup/PopupUpdate.java b/src/main/java/seedu/ibook/ui/popup/PopupUpdate.java
new file mode 100644
index 00000000000..a6be032c206
--- /dev/null
+++ b/src/main/java/seedu/ibook/ui/popup/PopupUpdate.java
@@ -0,0 +1,74 @@
+package seedu.ibook.ui.popup;
+
+import javafx.fxml.FXML;
+import javafx.scene.control.TextArea;
+import javafx.scene.control.TextField;
+import seedu.ibook.logic.commands.UpdateCommand;
+import seedu.ibook.logic.parser.CliSyntax;
+import seedu.ibook.model.product.Product;
+import seedu.ibook.ui.MainWindow;
+
+/**
+ * Popup responsible to update product.
+ */
+public class PopupUpdate extends Popup {
+
+    private static final String FXML = "popup/PopupUpdate.fxml";
+
+    private int index;
+
+    @FXML
+    private TextField name;
+    @FXML
+    private TextField category;
+    @FXML
+    private TextField expiryDate;
+    @FXML
+    private TextField price;
+    @FXML
+    private TextArea description;
+
+    /**
+     * Initializes a new {@code popupUpdate} window.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    public PopupUpdate(MainWindow mainWindow) {
+        super(FXML, mainWindow);
+    }
+
+    /**
+     * Shows the popup window.
+     *
+     * @param index Index of the product.
+     * @param product The product to be updated.
+     */
+    public void show(int index, Product product) {
+        super.show();
+        this.index = index;
+        name.setText(product.getName().toString());
+        category.setText(product.getCategory().toString());
+        expiryDate.setText(product.getExpiryDate().toString());
+        price.setText(product.getPrice().toString());
+        description.setText(product.getDescription().toString());
+    }
+
+    @FXML
+    private void handleUpdateProduct() {
+        String commandText = UpdateCommand.COMMAND_WORD
+                + " " + index
+                + " " + CliSyntax.PREFIX_NAME.getPrefix()
+                + name.getText()
+                + " " + CliSyntax.PREFIX_CATEGORY.getPrefix()
+                + category.getText()
+                + " " + CliSyntax.PREFIX_EXPIRY_DATE.getPrefix()
+                + expiryDate.getText()
+                + " " + CliSyntax.PREFIX_PRICE.getPrefix()
+                + price.getText()
+                + " " + CliSyntax.PREFIX_DESCRIPTION.getPrefix()
+                + description.getText();
+
+        execute(commandText);
+    }
+
+}
diff --git a/src/main/java/seedu/ibook/ui/table/ProductCard.java b/src/main/java/seedu/ibook/ui/table/ProductCard.java
new file mode 100644
index 00000000000..35a462945c4
--- /dev/null
+++ b/src/main/java/seedu/ibook/ui/table/ProductCard.java
@@ -0,0 +1,66 @@
+package seedu.ibook.ui.table;
+
+import javafx.fxml.FXML;
+import javafx.scene.control.Label;
+import javafx.scene.layout.HBox;
+import seedu.ibook.model.product.Product;
+import seedu.ibook.ui.MainWindow;
+import seedu.ibook.ui.UiComponent;
+
+/**
+ * A card showing the details of a {@code Product}.
+ */
+public class ProductCard extends UiComponent<HBox> {
+
+    private static final String FXML = "Table/ProductCard.fxml";
+
+    private final int index;
+    private final Product product;
+
+    @FXML
+    private Label indexLabel;
+    @FXML
+    private Label name;
+    @FXML
+    private Label category;
+    @FXML
+    private Label expiryDate;
+    @FXML
+    private Label price;
+    @FXML
+    private Label description;
+
+    /**
+     * Initializes a {@code ProductCard}.
+     *
+     * @param index Index of the {@code Product} in the filtered list.
+     * @param product The {@code Product}.
+     * @param mainWindow The Main Window that this component resides on.
+     */
+    ProductCard(int index, Product product, MainWindow mainWindow) {
+        super(FXML, mainWindow);
+        this.index = index;
+        this.product = product;
+        populateField();
+    }
+
+    private void populateField() {
+        indexLabel.setText(String.valueOf(index));
+        name.setText(product.getName().toString());
+        category.setText(product.getCategory().toString());
+        expiryDate.setText(product.getExpiryDate().toString());
+        price.setText(product.getPrice().toString());
+        description.setText(product.getDescription().toString());
+    }
+
+    @FXML
+    private void handlePopupUpdate() {
+        getMainWindow().showPopupUpdate(index, product);
+    }
+
+    @FXML
+    private void handlePopupDelete() {
+        getMainWindow().showPopupDelete(index, product);
+    }
+
+}
diff --git a/src/main/java/seedu/ibook/ui/table/Table.java b/src/main/java/seedu/ibook/ui/table/Table.java
new file mode 100644
index 00000000000..44da85e81c0
--- /dev/null
+++ b/src/main/java/seedu/ibook/ui/table/Table.java
@@ -0,0 +1,38 @@
+package seedu.ibook.ui.table;
+
+import javafx.collections.ObservableList;
+import javafx.scene.Node;
+import javafx.scene.layout.VBox;
+import seedu.ibook.ui.MainWindow;
+import seedu.ibook.ui.UiComponent;
+
+/**
+ * The table that is containing {@code TableContent} and {@code TableHeader}
+ */
+public class Table extends UiComponent<VBox> {
+
+    private static final String FXML = "Table/Table.fxml";
+
+    private TableHeader tableHeader;
+    private TableContent tableContent;
+
+    /**
+     * Initializes a {@code Table}.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    public Table(MainWindow mainWindow) {
+        super(FXML, mainWindow);
+        populateField();
+    }
+
+    private void populateField() {
+        ObservableList<Node> children = getRoot().getChildren();
+
+        tableHeader = new TableHeader(getMainWindow());
+        children.add(tableHeader.getRoot());
+
+        tableContent = new TableContent(getMainWindow());
+        children.add(tableContent.getRoot());
+    }
+}
diff --git a/src/main/java/seedu/ibook/ui/TableContent.java b/src/main/java/seedu/ibook/ui/table/TableContent.java
similarity index 50%
rename from src/main/java/seedu/ibook/ui/TableContent.java
rename to src/main/java/seedu/ibook/ui/table/TableContent.java
index 48bc1b56a28..25d803f7388 100644
--- a/src/main/java/seedu/ibook/ui/TableContent.java
+++ b/src/main/java/seedu/ibook/ui/table/TableContent.java
@@ -1,4 +1,4 @@
-package seedu.ibook.ui;
+package seedu.ibook.ui.table;
 
 import javafx.collections.ListChangeListener;
 import javafx.collections.ObservableList;
@@ -6,27 +6,36 @@
 import javafx.scene.control.ScrollPane;
 import javafx.scene.layout.VBox;
 import seedu.ibook.model.product.Product;
+import seedu.ibook.ui.MainWindow;
+import seedu.ibook.ui.UiComponent;
 
-public class TableContent extends UiPart<ScrollPane> {
+/**
+ * The main content of the table.
+ */
+public class TableContent extends UiComponent<ScrollPane> {
 
-    private static final String FXML = "TableContent.fxml";
-
-    private final ObservableList<Product> filteredIBook;
+    private static final String FXML = "Table/TableContent.fxml";
 
     @FXML
     private VBox content;
 
-    TableContent(ObservableList<Product> filteredIBook) {
-        super(FXML);
-        this.filteredIBook = filteredIBook;
-        this.filteredIBook.addListener(new Listener());
+    /**
+     * Initializes a {@code TableContent}.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    TableContent(MainWindow mainWindow) {
+        super(FXML, mainWindow);
         populateField();
     }
 
-    void populateField() {
+    private void populateField() {
+        ObservableList<Product> filteredIBook = getMainWindow().getFilteredIBook();
+        filteredIBook.addListener(new Listener());
+        content.getChildren().clear();
         for (int i = 0; i < filteredIBook.size(); i++) {
             Product product = filteredIBook.get(i);
-            ProductCard productCard = new ProductCard(i + 1, product);
+            ProductCard productCard = new ProductCard(i + 1, product, getMainWindow());
             content.getChildren().add(productCard.getRoot());
         }
     }
diff --git a/src/main/java/seedu/ibook/ui/table/TableHeader.java b/src/main/java/seedu/ibook/ui/table/TableHeader.java
new file mode 100644
index 00000000000..a051e94de54
--- /dev/null
+++ b/src/main/java/seedu/ibook/ui/table/TableHeader.java
@@ -0,0 +1,22 @@
+package seedu.ibook.ui.table;
+
+import javafx.scene.layout.HBox;
+import seedu.ibook.ui.MainWindow;
+import seedu.ibook.ui.UiComponent;
+
+/**
+ * Header of the Table
+ */
+public class TableHeader extends UiComponent<HBox> {
+
+    private static final String FXML = "Table/TableHeader.fxml";
+
+    /**
+     * Initializes a {@code TableHeader}.
+     *
+     * @param mainWindow The {@code MainWindow} that this component resides on.
+     */
+    TableHeader(MainWindow mainWindow) {
+        super(FXML, mainWindow);
+    }
+}
diff --git a/src/main/resources/images/edit-color.png b/src/main/resources/images/edit-color.png
new file mode 100644
index 00000000000..a9e357f3ca6
Binary files /dev/null and b/src/main/resources/images/edit-color.png differ
diff --git a/src/main/resources/images/edit.png b/src/main/resources/images/edit.png
index a9e357f3ca6..8eb31426df2 100644
Binary files a/src/main/resources/images/edit.png and b/src/main/resources/images/edit.png differ
diff --git a/src/main/resources/images/trash-2-color.png b/src/main/resources/images/trash-2-color.png
new file mode 100644
index 00000000000..4fcb90dd66b
Binary files /dev/null and b/src/main/resources/images/trash-2-color.png differ
diff --git a/src/main/resources/images/trash-2.png b/src/main/resources/images/trash-2.png
index 4fcb90dd66b..efe84bcd657 100644
Binary files a/src/main/resources/images/trash-2.png and b/src/main/resources/images/trash-2.png differ
diff --git a/src/main/resources/view/CommandBox.fxml b/src/main/resources/view/CommandBox.fxml
index dab72a507e5..ac8d06a27ea 100644
--- a/src/main/resources/view/CommandBox.fxml
+++ b/src/main/resources/view/CommandBox.fxml
@@ -8,15 +8,17 @@
 <?import javafx.scene.layout.HBox?>
 <?import javafx.scene.layout.VBox?>
 
-<HBox spacing="20.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
+<HBox xmlns="http://javafx.com/javafx/11" xmlns:fx="http://javafx.com/fxml/1"
+      alignment="CENTER_LEFT" spacing="20.0" stylesheets="@css/commandBox.css">
     <VBox.margin>
         <Insets left="40.0" right="40.0" top="40.0"/>
     </VBox.margin>
-    <Button alignment="CENTER_RIGHT" mnemonicParsing="false"
-            style="-fx-background-color: #9F93Ed; -fx-background-radius: 8;"
-            text="Create Item" textFill="WHITE">
+    <Button mnemonicParsing="false" styleClass="primary-button"
+            text="Add Product" textFill="WHITE"
+            onMouseClicked="#handleAddProductClicked">
         <graphic>
-            <ImageView fitHeight="14.0" fitWidth="14.0" pickOnBounds="true" preserveRatio="true">
+            <ImageView fitHeight="14.0" fitWidth="14.0"
+                       pickOnBounds="true" preserveRatio="true">
                 <Image url="@../images/plus-circle.png"/>
             </ImageView>
         </graphic>
@@ -25,10 +27,8 @@
         </padding>
     </Button>
     <TextField fx:id="commandTextField" onAction="#handleCommandEntered"
-               maxHeight="1.7976931348623157E308" promptText="Or Enter Command Here..."
-               style="-fx-background-color: transparent; -fx-border-style: solid;
-               -fx-border-width: 0 0 0.5 0;"
-               HBox.hgrow="ALWAYS" >
+               maxHeight="Infinity" promptText="Or Enter Command Here..."
+               styleClass="command" HBox.hgrow="ALWAYS" >
         <HBox.margin>
             <Insets right="10.0"/>
         </HBox.margin>
diff --git a/src/main/resources/view/MainWindow.fxml b/src/main/resources/view/MainWindow.fxml
index 03ef2372637..b7cf952a423 100644
--- a/src/main/resources/view/MainWindow.fxml
+++ b/src/main/resources/view/MainWindow.fxml
@@ -5,14 +5,15 @@
 <?import javafx.scene.layout.VBox?>
 <?import javafx.stage.Stage?>
 
-<fx:root type="javafx.stage.Stage" title="iBook" xmlns="http://javafx.com/javafx/8"
-         xmlns:fx="http://javafx.com/fxml/1">
+<fx:root type="javafx.stage.Stage"
+         xmlns="http://javafx.com/javafx/11" xmlns:fx="http://javafx.com/fxml/1"
+         title="iBook"  minHeight="700.0" minWidth="900.0">
     <scene>
-        <Scene stylesheets="@global.css">
-            <AnchorPane minHeight="700.0" minWidth="900.0" prefHeight="700.0" prefWidth="900.0"
-                        style="-fx-background-color: #F8F8F8;">
-                <VBox fx:id="mainContent" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0"
-                      AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+        <Scene stylesheets="@css/global.css">
+            <AnchorPane styleClass="main">
+                <VBox fx:id="mainContent" AnchorPane.bottomAnchor="0.0"
+                      AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0"
+                      AnchorPane.topAnchor="0.0">
                 </VBox>
             </AnchorPane>
         </Scene>
diff --git a/src/main/resources/view/MenuToolbar.fxml b/src/main/resources/view/MenuToolbar.fxml
index 0299462a533..9c4e826b1cb 100644
--- a/src/main/resources/view/MenuToolbar.fxml
+++ b/src/main/resources/view/MenuToolbar.fxml
@@ -4,13 +4,10 @@
 <?import javafx.scene.control.MenuBar?>
 <?import javafx.scene.control.MenuItem?>
 
-<MenuBar style="-fx-background-color: #9F93Ed;">
-    <Menu mnemonicParsing="false" style="-fx-text-fill: white;" text="File">
+<MenuBar styleClass="menu-bar" stylesheets="@css/menuToolbar.css">
+    <Menu mnemonicParsing="false" text="File">
         <MenuItem mnemonicParsing="false" text="Close"/>
     </Menu>
-    <Menu mnemonicParsing="false" text="Edit">
-        <MenuItem mnemonicParsing="false" text="Delete"/>
-    </Menu>
     <Menu mnemonicParsing="false" text="Help">
         <MenuItem mnemonicParsing="false" text="About"/>
     </Menu>
diff --git a/src/main/resources/view/ProductCard.fxml b/src/main/resources/view/ProductCard.fxml
deleted file mode 100644
index 19b244eb2ff..00000000000
--- a/src/main/resources/view/ProductCard.fxml
+++ /dev/null
@@ -1,80 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-
-<?import javafx.geometry.Insets?>
-<?import javafx.scene.control.Button?>
-<?import javafx.scene.control.Label?>
-<?import javafx.scene.image.Image?>
-<?import javafx.scene.image.ImageView?>
-<?import javafx.scene.layout.HBox?>
-
-<HBox xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1"
-      maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" spacing="5.0"
-      style="-fx-border-style: solid; -fx-border-width: 0 0 0.1 0;">
-    <padding>
-        <Insets bottom="10.0" left="10.0" right="10.0" top="10.0"/>
-    </padding>
-    <Label fx:id="index" contentDisplay="CENTER" maxHeight="1.7976931348623157E308"
-           maxWidth="1.7976931348623157E308" prefWidth="70.0">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label fx:id="name" contentDisplay="CENTER" maxHeight="1.7976931348623157E308"
-           maxWidth="1.7976931348623157E308"
-           prefWidth="100.0">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label fx:id="category" contentDisplay="CENTER" maxHeight="1.7976931348623157E308"
-           maxWidth="1.7976931348623157E308"
-           prefWidth="100.0">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label fx:id="expiryDate" contentDisplay="CENTER" maxHeight="1.7976931348623157E308"
-           maxWidth="1.7976931348623157E308"
-           prefWidth="100.0">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label fx:id="price" contentDisplay="CENTER" maxHeight="1.7976931348623157E308"
-           maxWidth="1.7976931348623157E308"
-           prefWidth="100.0">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label fx:id="description" contentDisplay="CENTER" maxHeight="1.7976931348623157E308"
-           maxWidth="1.7976931348623157E308" prefWidth="100.0" textOverrun="CLIP" wrapText="true"
-           HBox.hgrow="ALWAYS">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <HBox fx:id="action" alignment="CENTER" maxHeight="1.7976931348623157E308"
-          maxWidth="1.7976931348623157E308" prefWidth="100.0">
-        <padding>
-            <Insets left="10.0"/>
-        </padding>
-        <Button mnemonicParsing="false" style="-fx-background-color: transparent;">
-            <graphic>
-                <ImageView fitHeight="20.0" fitWidth="20.0" pickOnBounds="true" preserveRatio="true"
-                           style="-fx-background-color: # ffd970;">
-                    <Image url="@../images/edit.png"/>
-                </ImageView>
-            </graphic>
-        </Button>
-        <Button layoutX="10.0" layoutY="10.0" mnemonicParsing="false"
-                style="-fx-background-color: transparent;">
-            <graphic>
-                <ImageView fitHeight="20.0" fitWidth="20.0" pickOnBounds="true" preserveRatio="true"
-                           style="-fx-background-color: # ffd970;">
-                    <Image url="@../images/trash-2.png"/>
-                </ImageView>
-            </graphic>
-        </Button>
-    </HBox>
-</HBox>
diff --git a/src/main/resources/view/ResultWindow.fxml b/src/main/resources/view/ResultWindow.fxml
index 6f9cb32b216..f4c2fd4b21c 100644
--- a/src/main/resources/view/ResultWindow.fxml
+++ b/src/main/resources/view/ResultWindow.fxml
@@ -4,13 +4,8 @@
 <?import javafx.scene.layout.VBox?>
 <?import javafx.geometry.Insets?>
 
-<TextArea fx:id="resultDisplay" style="-fx-background-color: ffffff;
-        -fx-effect: dropshadow(three-pass-box, rgba(0,0,0,0.2), 18, 0, 0, 5);"
-          prefHeight="150.0" editable="false" xmlns="http://javafx.com/javafx/8"
-          xmlns:fx="http://javafx.com/fxml/1">
-    <padding>
-        <Insets bottom="10.0" left="10.0" right="10.0" top="10.0"/>
-    </padding>
+<TextArea editable="false" wrapText="true"
+          styleClass="result-window" stylesheets="@css/resultWindow.css">
     <VBox.margin>
         <Insets bottom="20.0" left="40.0" right="40.0" top="20.0"/>
     </VBox.margin>
diff --git a/src/main/resources/view/Table.fxml b/src/main/resources/view/Table.fxml
deleted file mode 100644
index 911aee1cb45..00000000000
--- a/src/main/resources/view/Table.fxml
+++ /dev/null
@@ -1,15 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-
-<?import javafx.geometry.Insets?>
-<?import javafx.scene.layout.VBox?>
-
-<VBox style="-fx-background-color: ffffff; -fx-background-radius: 12;
-        -fx-effect: dropshadow(three-pass-box, rgba(0,0,0,0.2), 18, 0, 0, 5);
-        -fx-background-insets: 15 20 20 20;" VBox.vgrow="ALWAYS">
-    <padding>
-        <Insets bottom="40.0" left="40.0" right="40.0" top="30.0" />
-    </padding>
-    <VBox.margin>
-        <Insets bottom="20.0" left="20.0" right="20.0" />
-    </VBox.margin>
-</VBox>
diff --git a/src/main/resources/view/Table/ProductCard.fxml b/src/main/resources/view/Table/ProductCard.fxml
new file mode 100644
index 00000000000..9d5573911e5
--- /dev/null
+++ b/src/main/resources/view/Table/ProductCard.fxml
@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import javafx.scene.control.Button?>
+<?import javafx.scene.control.Label?>
+<?import javafx.scene.image.Image?>
+<?import javafx.scene.image.ImageView?>
+<?import javafx.scene.layout.HBox?>
+
+<HBox xmlns="http://javafx.com/javafx/11" xmlns:fx="http://javafx.com/fxml/1"
+      styleClass="table-row">
+    <Label fx:id="indexLabel" styleClass="table-column-short"/>
+    <Label fx:id="name" styleClass="table-column-long"/>
+    <Label fx:id="category" styleClass="table-column-long"/>
+    <Label fx:id="expiryDate" styleClass="table-column-long"/>
+    <Label fx:id="price" styleClass="table-column-short"/>
+    <Label fx:id="description" styleClass="table-column-long" HBox.hgrow="ALWAYS"/>
+    <HBox fx:id="action" styleClass="table-column-long">
+        <Button alignment="CENTER" onMouseClicked="#handlePopupUpdate" mnemonicParsing="false" styleClass="edit">
+            <graphic>
+                <ImageView fitHeight="20.0" fitWidth="20.0" pickOnBounds="true" preserveRatio="true">
+                    <Image url="@../../images/edit-color.png"/>
+                </ImageView>
+            </graphic>
+        </Button>
+        <Button alignment="CENTER" onMouseClicked="#handlePopupDelete" mnemonicParsing="false" styleClass="delete">
+            <graphic>
+                <ImageView fitHeight="20.0" fitWidth="20.0" pickOnBounds="true" preserveRatio="true">
+                    <Image url="@../../images/trash-2-color.png"/>
+                </ImageView>
+            </graphic>
+        </Button>
+    </HBox>
+</HBox>
diff --git a/src/main/resources/view/Table/Table.fxml b/src/main/resources/view/Table/Table.fxml
new file mode 100644
index 00000000000..0b4e772a992
--- /dev/null
+++ b/src/main/resources/view/Table/Table.fxml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import javafx.geometry.Insets?>
+<?import javafx.scene.layout.VBox?>
+
+<VBox VBox.vgrow="ALWAYS" stylesheets="@../css/table.css" styleClass="table">
+    <VBox.margin>
+        <Insets bottom="20.0" left="20.0" right="20.0" />
+    </VBox.margin>
+</VBox>
diff --git a/src/main/resources/view/Table/TableContent.fxml b/src/main/resources/view/Table/TableContent.fxml
new file mode 100644
index 00000000000..b47c9b1c072
--- /dev/null
+++ b/src/main/resources/view/Table/TableContent.fxml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import javafx.scene.control.ScrollPane?>
+<?import javafx.scene.layout.VBox?>
+
+<ScrollPane xmlns="http://javafx.com/javafx/11" xmlns:fx="http://javafx.com/fxml/1"
+            fitToHeight="true" fitToWidth="true"
+            VBox.vgrow="ALWAYS" styleClass="table-content">
+    <VBox fx:id="content" style="-fx-background-color: white;"/>
+</ScrollPane>
diff --git a/src/main/resources/view/Table/TableHeader.fxml b/src/main/resources/view/Table/TableHeader.fxml
new file mode 100644
index 00000000000..cd7df570756
--- /dev/null
+++ b/src/main/resources/view/Table/TableHeader.fxml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import javafx.scene.control.Label?>
+<?import javafx.scene.layout.HBox?>
+
+<HBox styleClass="table-header">
+    <Label styleClass="table-column-short" text="INDEX"/>
+    <Label styleClass="table-column-long" text="NAME"/>
+    <Label styleClass="table-column-long" text="CATEGORY"/>
+    <Label styleClass="table-column-long" text="EXPIRY DATE"/>
+    <Label styleClass="table-column-short" text="PRICE"/>
+    <Label styleClass="table-column-long" text="DESCRIPTION" HBox.hgrow="ALWAYS"/>
+    <Label styleClass="table-column-long" HBox.hgrow="NEVER"/>
+</HBox>
diff --git a/src/main/resources/view/TableContent.fxml b/src/main/resources/view/TableContent.fxml
deleted file mode 100644
index 3232ff5e7fc..00000000000
--- a/src/main/resources/view/TableContent.fxml
+++ /dev/null
@@ -1,10 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-
-<?import javafx.scene.control.ScrollPane?>
-<?import javafx.scene.layout.VBox?>
-
-<ScrollPane xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1"
-            fitToHeight="true" fitToWidth="true" style="-fx-background-color: transparent;"
-            VBox.vgrow="ALWAYS">
-    <VBox fx:id="content" style="-fx-background-color: #ffffff;"/>
-</ScrollPane>
diff --git a/src/main/resources/view/TableHeader.fxml b/src/main/resources/view/TableHeader.fxml
deleted file mode 100644
index f082f54d490..00000000000
--- a/src/main/resources/view/TableHeader.fxml
+++ /dev/null
@@ -1,50 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-
-<?import javafx.geometry.Insets?>
-<?import javafx.scene.control.Label?>
-<?import javafx.scene.layout.HBox?>
-
-<HBox spacing="5.0" style="-fx-border-style: solid; -fx-border-width: 0 0 0.1 0;">
-    <padding>
-        <Insets bottom="10.0" left="10.0" right="10.0" top="10.0"/>
-    </padding>
-    <Label contentDisplay="CENTER" prefWidth="70.0" styleClass="grid-title" text="INDEX">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label contentDisplay="CENTER" prefWidth="100.0" styleClass="grid-title" text="NAME">
-        <HBox.margin>
-            <Insets/>
-        </HBox.margin>
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label contentDisplay="CENTER" prefWidth="100.0" styleClass="grid-title" text="CATEGORY">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label contentDisplay="CENTER" prefWidth="100.0" styleClass="grid-title" text="EXPIRY DATE">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label contentDisplay="CENTER" prefWidth="100.0" styleClass="grid-title" text="PRICE">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label contentDisplay="CENTER" maxWidth="1.7976931348623157E308" prefWidth="100.0" styleClass="grid-title"
-           text="DESCRIPTION" HBox.hgrow="ALWAYS">
-        <padding>
-            <Insets left="10.0" right="10.0"/>
-        </padding>
-    </Label>
-    <Label contentDisplay="CENTER" prefWidth="100.0" styleClass="grid-title" HBox.hgrow="NEVER">
-        <padding>
-            <Insets left="10.0"/>
-        </padding>
-    </Label>
-</HBox>
diff --git a/src/main/resources/view/css/commandBox.css b/src/main/resources/view/css/commandBox.css
new file mode 100644
index 00000000000..1884ff7bd08
--- /dev/null
+++ b/src/main/resources/view/css/commandBox.css
@@ -0,0 +1,11 @@
+.command {
+    -fx-background-color: #F1F2F3;
+    -fx-background-radius: 8;
+    -fx-padding: 15;
+}
+
+.command:focused {
+    -fx-background-color: white;
+    -fx-effect: dropshadow(gaussian, rgba(0, 0, 0, 0.2), 3.5, 0.4, 0, 1);
+    -fx-prompt-text-fill: derive(-fx-control-inner-background,-30%);
+}
diff --git a/src/main/resources/view/css/global.css b/src/main/resources/view/css/global.css
new file mode 100644
index 00000000000..9beb72a6540
--- /dev/null
+++ b/src/main/resources/view/css/global.css
@@ -0,0 +1,31 @@
+@font-face {
+    src: url('../font/NotoSans-Regular.ttf');
+}
+
+@font-face {
+    src: url('../font/NotoSans-Thin.ttf');
+}
+
+.root {
+    -fx-font-family: 'Noto Sans';
+}
+
+.main {
+    -fx-min-height: 700;
+    -fx-min-width: 900;
+    -fx-background-color: white;
+}
+
+.primary-button {
+    -fx-background-color: #9F93Ed;
+    -fx-background-radius: 8;
+    -fx-text-fill: white;
+}
+
+.primary-button:hover {
+    -fx-background-color: #8373E7;
+}
+
+.primary-button:pressed {
+    -fx-background-color: #7D6DE0;
+}
diff --git a/src/main/resources/view/css/menuToolbar.css b/src/main/resources/view/css/menuToolbar.css
new file mode 100644
index 00000000000..1d7e66ef613
--- /dev/null
+++ b/src/main/resources/view/css/menuToolbar.css
@@ -0,0 +1,31 @@
+.menu-bar {
+    -fx-background-color: #9F93Ed
+}
+
+.menu .label {
+    -fx-text-fill: white;
+}
+
+.menu:hover,
+.menu:showing {
+    -fx-background-color: #8373E7;
+    -fx-text-fill: white;
+}
+
+.menu-item {
+    -fx-background-color: white;
+    -fx-text-fill: black;
+}
+
+.menu-item .label {
+    -fx-text-fill: black;
+}
+
+.menu-item:focused .label {
+    -fx-text-fill: black;
+}
+
+.menu-item:focused {
+    -fx-background: -fx-accent;
+    -fx-background-color: #E0E0E0;
+}
diff --git a/src/main/resources/view/css/popup.css b/src/main/resources/view/css/popup.css
new file mode 100644
index 00000000000..979e3fbffd4
--- /dev/null
+++ b/src/main/resources/view/css/popup.css
@@ -0,0 +1,72 @@
+.title {
+    -fx-font-family: 'Noto Sans Thin';
+    -fx-min-width: 100;
+    -fx-font-size: 28;
+}
+
+.alert {
+    -fx-text-fill: #D82148;
+}
+
+.text-area .content {
+    -fx-background-color: transparent, white, transparent, white;
+}
+
+.text-area {
+    -fx-background-insets: 0;
+    -fx-background-color: transparent;
+    -fx-border-style: solid;
+    -fx-border-width: 1;
+    -fx-border-radius: 3;
+    -fx-padding : 4 2;
+    -fx-border-color: #CCC;
+}
+
+.text-area:focused {
+    -fx-border-color: #9F93Ed;
+    -fx-border-width: 1;
+    -fx-prompt-text-fill: derive(-fx-control-inner-background,-30%);
+}
+
+.text-field {
+    -fx-background-color: transparent;
+    -fx-border-style: solid;
+    -fx-border-width: 1;
+    -fx-border-radius: 3;
+    -fx-padding : 8 8;
+    -fx-border-color: #CCC;
+}
+
+.text-field:focused {
+    -fx-border-color: #9F93Ed;
+    -fx-border-width: 1;
+    -fx-prompt-text-fill: derive(-fx-control-inner-background,-30%);
+}
+
+.edit-button {
+    -fx-background-color: #FFE08A;
+    -fx-background-radius: 8;
+    -fx-text-fill: #000000B3;
+}
+
+.edit-button:hover {
+    -fx-background-color: #FFDC76;
+}
+
+.edit-button:pressed {
+    -fx-background-color: #FFD970;
+}
+
+.delete-button {
+    -fx-background-color: #F6416C;
+    -fx-background-radius: 8;
+    -fx-text-fill: white;
+}
+
+.delete-button:hover {
+    -fx-background-color: #E6315C;
+}
+
+.delete-button:pressed {
+    -fx-background-color: #E03957;
+}
diff --git a/src/main/resources/view/css/resultWindow.css b/src/main/resources/view/css/resultWindow.css
new file mode 100644
index 00000000000..66e8d323290
--- /dev/null
+++ b/src/main/resources/view/css/resultWindow.css
@@ -0,0 +1,16 @@
+.result-window {
+    -fx-pref-height: 100;
+    -fx-background-color: white;
+    -fx-effect: dropshadow(gaussian, rgba(0,0,0,0.2), 18, 0, 0, 5);
+    -fx-padding: 10;
+    -fx-font-size: 16;
+}
+
+.text-area {
+    -fx-background-insets: 0;
+    -fx-background-color: white;
+}
+
+.text-area .content {
+    -fx-background-color: white;
+}
diff --git a/src/main/resources/view/css/table.css b/src/main/resources/view/css/table.css
new file mode 100644
index 00000000000..6d302d45d93
--- /dev/null
+++ b/src/main/resources/view/css/table.css
@@ -0,0 +1,81 @@
+.table {
+    -fx-background-color: white;
+    -fx-background-radius: 12;
+    -fx-effect: dropshadow(gaussian, rgba(0,0,0,0.2), 18, 0, 0, 5);
+    -fx-background-insets: 15 20 20 20;
+    -fx-padding: 30 40 40 40;
+}
+
+.table-header {
+    -fx-border-style: solid;
+    -fx-border-width: 0 0 0.1 0;
+    -fx-spacing: 5;
+    -fx-padding: 10;
+}
+
+.table-header .table-column-long {
+    -fx-border-width: 0 0 0 0.1;
+    -fx-border-style: solid;
+    -fx-text-fill: #AEAEAE;
+}
+
+.table-header .table-column-short {
+    -fx-border-width: 0 0 0 0.1;
+    -fx-border-style: solid;
+    -fx-text-fill: #AEAEAE;
+}
+
+.table-column-short {
+    -fx-padding: 0 10;
+    -fx-pref-width: 70;
+    -fx-max-width: Infinity;
+    -fx-max-height: Infinity;
+    -fx-text-overrun: CLIP;
+    -fx-wrap-text: true;
+}
+
+.table-column-long {
+    -fx-padding: 0 10;
+    -fx-pref-width: 100;
+    -fx-max-width: Infinity;
+    -fx-max-height: Infinity;
+    -fx-text-overrun: CLIP;
+    -fx-wrap-text: true;
+}
+
+.table-content {
+    -fx-background-color: transparent;
+}
+
+.table-row {
+    -fx-max-width: Infinity;
+    -fx-max-height: Infinity;
+    -fx-border-style: solid;
+    -fx-border-width: 0 0 0.1 0;
+    -fx-spacing: 5;
+    -fx-padding: 10;
+}
+
+.table-row .edit {
+    -fx-background-color: transparent;
+}
+
+.table-row .edit:hover {
+    -fx-background-color: #F4F5F6;
+}
+
+.table-row .edit:pressed {
+    -fx-background-color: #F1F2F3;
+}
+
+.table-row .delete {
+    -fx-background-color: transparent;
+}
+
+.table-row .delete:hover {
+    -fx-background-color: #F4F5F6;
+}
+
+.table-row .delete:pressed {
+    -fx-background-color: #F1F2F3;
+}
diff --git a/src/main/resources/view/font/NotoSans-Regular.ttf b/src/main/resources/view/font/NotoSans-Regular.ttf
new file mode 100644
index 00000000000..91a774a0a70
Binary files /dev/null and b/src/main/resources/view/font/NotoSans-Regular.ttf differ
diff --git a/src/main/resources/view/font/NotoSans-Thin.ttf b/src/main/resources/view/font/NotoSans-Thin.ttf
new file mode 100644
index 00000000000..f14dd6ab733
Binary files /dev/null and b/src/main/resources/view/font/NotoSans-Thin.ttf differ
diff --git a/src/main/resources/view/global.css b/src/main/resources/view/global.css
deleted file mode 100644
index bdd2cd02532..00000000000
--- a/src/main/resources/view/global.css
+++ /dev/null
@@ -1,42 +0,0 @@
-.grid-title {
-    -fx-border-width: 0 0 0 0.1;
-    -fx-border-style: solid;
-    -fx-text-fill: #AEAEAE;
-}
-
-.menu .label {
-    -fx-text-fill: #FFFFFF;
-}
-
-.menu:hover,
-.menu:showing {
-    -fx-background-color: #8373e7;
-    -fx-text-fill: #FFFFFF;
-}
-
-.menu-item {
-    -fx-background-color: #FFFFFF;
-    -fx-text-fill: #000000;
-}
-
-.menu-item .label {
-    -fx-text-fill: #000000;
-}
-
-.menu-item:focused .label {
-    -fx-text-fill: #000000;
-}
-
-.menu-item:focused {
-    -fx-background: -fx-accent;
-    -fx-background-color: #E0E0E0;
-}
-
-.text-area {
-    -fx-background-insets: 0;
-    -fx-background-color: white;
-}
-
-.text-area .content {
-    -fx-background-color: white;
-}
diff --git a/src/main/resources/view/popup/PopupAdd.fxml b/src/main/resources/view/popup/PopupAdd.fxml
new file mode 100644
index 00000000000..3c6e4e150a6
--- /dev/null
+++ b/src/main/resources/view/popup/PopupAdd.fxml
@@ -0,0 +1,126 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import java.net.URL?>
+
+<?import javafx.geometry.Insets?>
+<?import javafx.scene.Scene?>
+<?import javafx.scene.control.Button?>
+<?import javafx.scene.control.Label?>
+<?import javafx.scene.control.TextArea?>
+<?import javafx.scene.control.TextField?>
+<?import javafx.scene.image.Image?>
+<?import javafx.scene.image.ImageView?>
+<?import javafx.scene.layout.AnchorPane?>
+<?import javafx.scene.layout.HBox?>
+<?import javafx.scene.layout.VBox?>
+<?import javafx.scene.text.Text?>
+<?import javafx.stage.Stage?>
+
+<fx:root xmlns="http://javafx.com/javafx/11" xmlns:fx="http://javafx.com/fxml/1"
+         type="javafx.stage.Stage" resizable="false" title="Add Product" >
+    <scene>
+        <Scene>
+           <stylesheets>
+              <URL value="@../css/global.css" />
+              <URL value="@../css/popup.css" />
+           </stylesheets>
+           <AnchorPane style="-fx-background-color: white;">
+              <VBox AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0"
+                    AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+                 <padding>
+                    <Insets bottom="20.0" left="20.0" right="20.0" top="20.0"/>
+                 </padding>
+                 <Label text="Product" styleClass="title" />
+                 <HBox maxWidth="Infinity" spacing="20.0">
+                    <VBox.margin>
+                       <Insets top="20.0"/>
+                    </VBox.margin>
+                    <VBox HBox.hgrow="ALWAYS">
+                       <HBox spacing="3.0">
+                          <Label styleClass="field-label" text="Name"/>
+                          <Label alignment="CENTER" text="*" styleClass="alert"/>
+                       </HBox>
+                       <TextField fx:id="name" promptText="Maggie Mee">
+                          <VBox.margin>
+                             <Insets top="5.0"/>
+                          </VBox.margin>
+                       </TextField>
+                    </VBox>
+                    <VBox HBox.hgrow="ALWAYS">
+                       <HBox spacing="3.0">
+                          <Label styleClass="field-label" text="Category"/>
+                          <Label alignment="CENTER" text="*" styleClass="alert"/>
+                       </HBox>
+                       <TextField fx:id="category" promptText="Noodles">
+                          <VBox.margin>
+                             <Insets top="5.0"/>
+                          </VBox.margin>
+                       </TextField>
+                    </VBox>
+                 </HBox>
+                 <HBox maxWidth="Infinity" spacing="20.0">
+                    <VBox.margin>
+                       <Insets top="30.0"/>
+                    </VBox.margin>
+                    <VBox HBox.hgrow="ALWAYS">
+                       <HBox spacing="3.0">
+                          <Label styleClass="field-label" text="Expiry Date"/>
+                       </HBox>
+                       <TextField fx:id="expiryDate" promptText="2022-12-31">
+                          <VBox.margin>
+                             <Insets top="5.0"/>
+                          </VBox.margin>
+                       </TextField>
+                    </VBox>
+                    <VBox HBox.hgrow="ALWAYS">
+                       <HBox spacing="3.0">
+                          <Label styleClass="field-label" text="Price"/>
+                       </HBox>
+                       <TextField fx:id="price" promptText="3.33">
+                          <VBox.margin>
+                             <Insets top="5.0"/>
+                          </VBox.margin>
+                       </TextField>
+                    </VBox>
+                 </HBox>
+                 <VBox maxHeight="Infinity" VBox.vgrow="ALWAYS">
+                    <VBox.margin>
+                       <Insets top="30.0"/>
+                    </VBox.margin>
+                    <HBox spacing="3.0">
+                       <VBox.margin>
+                          <Insets top="10.0"/>
+                       </VBox.margin>
+                       <Label styleClass="field-label" text="Description"/>
+                    </HBox>
+                    <TextArea fx:id="description" maxHeight="Infinity"
+                              promptText="The best noodle in the world..."
+                              prefRowCount="3" VBox.vgrow="ALWAYS">
+                       <VBox.margin>
+                          <Insets top="5.0"/>
+                       </VBox.margin>
+                    </TextArea>
+                 </VBox>
+                 <HBox alignment="CENTER_RIGHT" maxWidth="Infinity" spacing="20">
+                    <VBox.margin>
+                       <Insets top="20.0" bottom="10.0"/>
+                    </VBox.margin>
+                    <Text fx:id="error" wrappingWidth="465" fill="#F84748"/>
+                    <Button onMouseClicked="#handleCreateProduct" alignment="CENTER_RIGHT"
+                            mnemonicParsing="false" styleClass="primary-button" text="Add">
+                       <graphic>
+                          <ImageView fitHeight="14.0" fitWidth="14.0"
+                                     pickOnBounds="true" preserveRatio="true">
+                             <Image url="@../../images/plus-circle.png"/>
+                          </ImageView>
+                       </graphic>
+                       <padding>
+                          <Insets bottom="8.0" left="15.0" right="15.0" top="8.0"/>
+                       </padding>
+                    </Button>
+                 </HBox>
+              </VBox>
+           </AnchorPane>
+        </Scene>
+    </scene>
+</fx:root>
diff --git a/src/main/resources/view/popup/PopupDelete.fxml b/src/main/resources/view/popup/PopupDelete.fxml
new file mode 100644
index 00000000000..72e1c192dee
--- /dev/null
+++ b/src/main/resources/view/popup/PopupDelete.fxml
@@ -0,0 +1,63 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import java.net.URL?>
+
+<?import javafx.geometry.Insets?>
+<?import javafx.scene.Scene?>
+<?import javafx.scene.control.Button?>
+<?import javafx.scene.control.Label?>
+<?import javafx.scene.image.Image?>
+<?import javafx.scene.image.ImageView?>
+<?import javafx.scene.layout.AnchorPane?>
+<?import javafx.scene.layout.HBox?>
+<?import javafx.scene.layout.VBox?>
+<?import javafx.scene.text.Font?>
+<?import javafx.scene.text.Text?>
+<?import javafx.stage.Stage?>
+
+<fx:root xmlns="http://javafx.com/javafx/11" xmlns:fx="http://javafx.com/fxml/1"
+         type="javafx.stage.Stage" resizable="false" title="Delete Product">
+    <scene>
+        <Scene>
+           <stylesheets>
+              <URL value="@../css/global.css" />
+              <URL value="@../css/popup.css" />
+           </stylesheets>
+           <AnchorPane style="-fx-background-color: white;">
+              <VBox AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0"
+                    AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+                 <padding>
+                    <Insets bottom="20.0" left="20.0" right="20.0" top="20.0"/>
+                 </padding>
+                 <Label text="Confirmation" styleClass="title"/>
+                 <Label fx:id="message">
+                    <VBox.margin>
+                       <Insets top="20.0" bottom="10.0"/>
+                    </VBox.margin>
+                    <font>
+                       <Font size="16.0"/>
+                    </font>
+                 </Label>
+                 <HBox alignment="CENTER_RIGHT" maxWidth="Infinity" spacing="20">
+                    <VBox.margin>
+                       <Insets top="20.0" bottom="10.0"/>
+                    </VBox.margin>
+                    <Text fx:id="error" wrappingWidth="445" fill="#F84748" />
+                    <Button onMouseClicked="#handleDeleteProduct" alignment="CENTER_RIGHT"
+                            mnemonicParsing="false" styleClass="delete-button" text="Delete">
+                       <graphic>
+                          <ImageView fitHeight="14.0" fitWidth="14.0" pickOnBounds="true"
+                                     preserveRatio="true">
+                             <Image url="@../../images/trash-2.png"/>
+                          </ImageView>
+                       </graphic>
+                       <padding>
+                          <Insets bottom="8.0" left="15.0" right="15.0" top="8.0"/>
+                       </padding>
+                    </Button>
+                 </HBox>
+              </VBox>
+           </AnchorPane>
+        </Scene>
+    </scene>
+</fx:root>
diff --git a/src/main/resources/view/popup/PopupUpdate.fxml b/src/main/resources/view/popup/PopupUpdate.fxml
new file mode 100644
index 00000000000..b6011895a28
--- /dev/null
+++ b/src/main/resources/view/popup/PopupUpdate.fxml
@@ -0,0 +1,129 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import java.net.URL?>
+
+<?import javafx.geometry.Insets?>
+<?import javafx.scene.Scene?>
+<?import javafx.scene.control.Button?>
+<?import javafx.scene.control.Label?>
+<?import javafx.scene.control.TextArea?>
+<?import javafx.scene.control.TextField?>
+<?import javafx.scene.image.Image?>
+<?import javafx.scene.image.ImageView?>
+<?import javafx.scene.layout.AnchorPane?>
+<?import javafx.scene.layout.HBox?>
+<?import javafx.scene.layout.VBox?>
+<?import javafx.scene.text.Text?>
+<?import javafx.stage.Stage?>
+
+<fx:root xmlns="http://javafx.com/javafx/11" xmlns:fx="http://javafx.com/fxml/1"
+         type="javafx.stage.Stage" resizable="false" title="Update Product">
+    <scene>
+        <Scene>
+           <stylesheets>
+              <URL value="@../css/global.css" />
+              <URL value="@../css/popup.css" />
+           </stylesheets>
+           <AnchorPane style="-fx-background-color: white;">
+              <VBox AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0"
+                    AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
+                 <padding>
+                    <Insets bottom="20.0" left="20.0" right="20.0" top="20.0"/>
+                 </padding>
+                 <Label text="Product" styleClass="title"/>
+                 <HBox maxWidth="Infinity" spacing="20.0">
+                    <VBox.margin>
+                       <Insets top="20.0"/>
+                    </VBox.margin>
+                    <VBox HBox.hgrow="ALWAYS">
+                       <HBox spacing="3.0">
+                          <Label styleClass="field-label" text="Name"/>
+                          <Label alignment="CENTER" text="*" styleClass="alert"/>
+                       </HBox>
+                       <TextField fx:id="name" promptText="Maggie Mee">
+                          <VBox.margin>
+                             <Insets top="5.0"/>
+                          </VBox.margin>
+                       </TextField>
+                    </VBox>
+                    <VBox HBox.hgrow="ALWAYS">
+                       <HBox spacing="3.0">
+                          <VBox.margin>
+                             <Insets/>
+                          </VBox.margin>
+                          <Label styleClass="field-label" text="Category"/>
+                          <Label alignment="CENTER" text="*" styleClass="alert"/>
+                       </HBox>
+                       <TextField fx:id="category" promptText="Noodles">
+                          <VBox.margin>
+                             <Insets top="5.0"/>
+                          </VBox.margin>
+                       </TextField>
+                    </VBox>
+                 </HBox>
+                 <HBox maxWidth="Infinity" spacing="20.0">
+                    <VBox.margin>
+                       <Insets top="30.0"/>
+                    </VBox.margin>
+                    <VBox HBox.hgrow="ALWAYS">
+                       <HBox spacing="3.0">
+                          <Label styleClass="field-label" text="Expiry Date"/>
+                       </HBox>
+                       <TextField fx:id="expiryDate" promptText="2022-12-31">
+                          <VBox.margin>
+                             <Insets top="5.0"/>
+                          </VBox.margin>
+                       </TextField>
+                    </VBox>
+                    <VBox HBox.hgrow="ALWAYS">
+                       <HBox spacing="3.0">
+                          <Label styleClass="field-label" text="Price"/>
+                       </HBox>
+                       <TextField fx:id="price" promptText="3.33">
+                          <VBox.margin>
+                             <Insets top="5.0"/>
+                          </VBox.margin>
+                       </TextField>
+                    </VBox>
+                 </HBox>
+                 <VBox maxHeight="Infinity" VBox.vgrow="ALWAYS">
+                    <VBox.margin>
+                       <Insets top="30.0"/>
+                    </VBox.margin>
+                    <HBox spacing="3.0">
+                       <VBox.margin>
+                          <Insets top="10.0"/>
+                       </VBox.margin>
+                       <Label styleClass="field-label" text="Description"/>
+                    </HBox>
+                    <TextArea fx:id="description" maxHeight="Infinity"
+                              promptText="The best noodle in the world..."
+                              prefRowCount="3" VBox.vgrow="ALWAYS">
+                       <VBox.margin>
+                          <Insets top="5.0"/>
+                       </VBox.margin>
+                    </TextArea>
+                 </VBox>
+                 <HBox alignment="CENTER_RIGHT" maxWidth="Infinity" spacing="20">
+                    <VBox.margin>
+                       <Insets top="20.0" bottom="10.0"/>
+                    </VBox.margin>
+                    <Text fx:id="error" wrappingWidth="445" fill="#F84748" />
+                    <Button onMouseClicked="#handleUpdateProduct" alignment="CENTER_RIGHT"
+                            mnemonicParsing="false" styleClass="edit-button" text="Update">
+                       <graphic>
+                          <ImageView fitHeight="14.0" opacity="0.45" fitWidth="14.0"
+                                     pickOnBounds="true" preserveRatio="true">
+                             <Image url="@../../images/edit.png"/>
+                          </ImageView>
+                       </graphic>
+                       <padding>
+                          <Insets bottom="8.0" left="15.0" right="15.0" top="8.0"/>
+                       </padding>
+                    </Button>
+                 </HBox>
+              </VBox>
+           </AnchorPane>
+        </Scene>
+    </scene>
+</fx:root>
diff --git a/src/test/java/seedu/ibook/logic/commands/AddCommandTest.java b/src/test/java/seedu/ibook/logic/commands/AddCommandTest.java
index c3cfa5e6180..931f2145c7c 100644
--- a/src/test/java/seedu/ibook/logic/commands/AddCommandTest.java
+++ b/src/test/java/seedu/ibook/logic/commands/AddCommandTest.java
@@ -41,23 +41,23 @@ public void execute_productAcceptedByModel_addSuccessful() throws Exception {
 
     @Test
     public void equals() {
-        Product alice = new ProductBuilder().withName("Alice").build();
-        Product bob = new ProductBuilder().withName("Bob").build();
-        AddCommand addAliceCommand = new AddCommand(alice);
-        AddCommand addBobCommand = new AddCommand(bob);
+        Product productA = new ProductBuilder().withName("Product A").build();
+        Product productB = new ProductBuilder().withName("Product B").build();
+        AddCommand addProductACommand = new AddCommand(productA);
+        AddCommand addProductBCommand = new AddCommand(productB);
 
         // same object -> returns true
-        assertEquals(addAliceCommand, addAliceCommand);
+        assertEquals(addProductACommand, addProductACommand);
 
         // same values -> returns true
-        AddCommand addAliceCommandCopy = new AddCommand(alice);
-        assertEquals(addAliceCommand, addAliceCommandCopy);
+        AddCommand addProductACommandCopy = new AddCommand(productA);
+        assertEquals(addProductACommand, addProductACommandCopy);
 
         // null -> returns false
-        assertNotEquals(null, addAliceCommand);
+        assertNotEquals(null, addProductACommand);
 
         // different product -> returns false
-        assertNotEquals(addAliceCommand, addBobCommand);
+        assertNotEquals(addProductACommand, addProductBCommand);
     }
 
     /**
diff --git a/src/test/java/seedu/ibook/logic/commands/CommandTestUtil.java b/src/test/java/seedu/ibook/logic/commands/CommandTestUtil.java
index 65267ffd451..b83e2d31e5c 100644
--- a/src/test/java/seedu/ibook/logic/commands/CommandTestUtil.java
+++ b/src/test/java/seedu/ibook/logic/commands/CommandTestUtil.java
@@ -49,7 +49,7 @@ public class CommandTestUtil {
     public static final String INVALID_NAME_DESC = " " + PREFIX_NAME + "Bread&"; // '&' not allowed in names
     public static final String INVALID_CATEGORY_DESC = " " + PREFIX_CATEGORY + "Bread&"; // '&' not allowed in category
     public static final String INVALID_EXPIRY_DATE_DESC = " " + PREFIX_EXPIRY_DATE + "2022 03 08"; // incorrect format
-    public static final String INVALID_DESCRIPTION_DESC = " " + PREFIX_DESCRIPTION; // empty string not allowed for desc
+    public static final String INVALID_DESCRIPTION_DESC = " " + PREFIX_DESCRIPTION + "Bread&"; // '&' not allowed
     public static final String INVALID_PRICE_DESC = " " + PREFIX_PRICE + "-1"; // price must be a positive amount
 
     public static final String PREAMBLE_WHITESPACE = "\t  \r  \n";
diff --git a/src/test/java/seedu/ibook/logic/commands/FindCommandTest.java b/src/test/java/seedu/ibook/logic/commands/FindCommandTest.java
index 59be41aa0a8..2fde817c81c 100644
--- a/src/test/java/seedu/ibook/logic/commands/FindCommandTest.java
+++ b/src/test/java/seedu/ibook/logic/commands/FindCommandTest.java
@@ -50,7 +50,7 @@ public class FindCommandTest {
                     new Category(VALID_CATEGORY_A),
                     new ExpiryDate(VALID_EXPIRY_DATE_A),
                     new Description(VALID_DESCRIPTION_A),
-                    Price.WILDPRICE));
+                    Price.WILD_PRICE));
 
     private ProductFulfillsFiltersPredicate kayaPredicate =
             new ProductFulfillsFiltersPredicate(KAYA_BREAD);
diff --git a/src/test/java/seedu/ibook/logic/parser/AddCommandParserTest.java b/src/test/java/seedu/ibook/logic/parser/AddCommandParserTest.java
index 94a4fba3b46..795bef38a9a 100644
--- a/src/test/java/seedu/ibook/logic/parser/AddCommandParserTest.java
+++ b/src/test/java/seedu/ibook/logic/parser/AddCommandParserTest.java
@@ -7,8 +7,14 @@
 import static seedu.ibook.logic.commands.CommandTestUtil.DESCRIPTION_FULL_B;
 import static seedu.ibook.logic.commands.CommandTestUtil.EXPIRY_DATE_FULL_A;
 import static seedu.ibook.logic.commands.CommandTestUtil.EXPIRY_DATE_FULL_B;
+import static seedu.ibook.logic.commands.CommandTestUtil.INVALID_CATEGORY_DESC;
+import static seedu.ibook.logic.commands.CommandTestUtil.INVALID_DESCRIPTION_DESC;
+import static seedu.ibook.logic.commands.CommandTestUtil.INVALID_EXPIRY_DATE_DESC;
+import static seedu.ibook.logic.commands.CommandTestUtil.INVALID_NAME_DESC;
+import static seedu.ibook.logic.commands.CommandTestUtil.INVALID_PRICE_DESC;
 import static seedu.ibook.logic.commands.CommandTestUtil.NAME_FULL_A;
 import static seedu.ibook.logic.commands.CommandTestUtil.NAME_FULL_B;
+import static seedu.ibook.logic.commands.CommandTestUtil.PREAMBLE_NON_EMPTY;
 import static seedu.ibook.logic.commands.CommandTestUtil.PRICE_FULL_A;
 import static seedu.ibook.logic.commands.CommandTestUtil.PRICE_FULL_B;
 import static seedu.ibook.logic.commands.CommandTestUtil.VALID_CATEGORY_B;
@@ -23,6 +29,11 @@
 import org.junit.jupiter.api.Test;
 
 import seedu.ibook.logic.commands.AddCommand;
+import seedu.ibook.model.product.Category;
+import seedu.ibook.model.product.Description;
+import seedu.ibook.model.product.ExpiryDate;
+import seedu.ibook.model.product.Name;
+import seedu.ibook.model.product.Price;
 import seedu.ibook.model.product.Product;
 import seedu.ibook.testutil.ProductBuilder;
 
@@ -47,11 +58,6 @@ public void parse_compulsoryFieldMissing_failure() {
             VALID_NAME_B + CATEGORY_FULL_B + EXPIRY_DATE_FULL_B + DESCRIPTION_FULL_B + PRICE_FULL_B,
             expectedMessage);
 
-        // missing category prefix
-        assertParseFailure(parser,
-            NAME_FULL_B + VALID_CATEGORY_B + EXPIRY_DATE_FULL_B + DESCRIPTION_FULL_B + PRICE_FULL_B,
-            expectedMessage);
-
         // missing expiry date prefix
         assertParseFailure(parser,
             NAME_FULL_B + CATEGORY_FULL_B + VALID_EXPIRY_DATE_B + DESCRIPTION_FULL_B + PRICE_FULL_B,
@@ -73,7 +79,39 @@ public void parse_compulsoryFieldMissing_failure() {
             expectedMessage);
     }
 
+    @Test
+    public void parse_setDefaultCategory_success() {
+        // missing category
+        Product expectedProduct = new ProductBuilder(PRODUCT_A).withCategory(Category.DEFAULT_CATEGORY).build();
+        assertParseSuccess(parser, NAME_FULL_A + EXPIRY_DATE_FULL_A + DESCRIPTION_FULL_A + PRICE_FULL_A,
+            new AddCommand(expectedProduct));
+    }
+
     @Test
     public void parse_invalidValue_failure() {
+        // invalid name
+        assertParseFailure(parser, INVALID_NAME_DESC + CATEGORY_FULL_B + EXPIRY_DATE_FULL_B + DESCRIPTION_FULL_B
+            + PRICE_FULL_B, Name.MESSAGE_CONSTRAINTS);
+
+        // invalid category
+        assertParseFailure(parser, NAME_FULL_B + INVALID_CATEGORY_DESC + EXPIRY_DATE_FULL_B + DESCRIPTION_FULL_B
+            + PRICE_FULL_B, Category.MESSAGE_CONSTRAINTS);
+
+        // invalid expiry date
+        assertParseFailure(parser, NAME_FULL_B + CATEGORY_FULL_B + INVALID_EXPIRY_DATE_DESC + DESCRIPTION_FULL_B
+            + PRICE_FULL_B, ExpiryDate.MESSAGE_CONSTRAINTS);
+
+        // invalid description
+        assertParseFailure(parser, NAME_FULL_B + CATEGORY_FULL_B + EXPIRY_DATE_FULL_B + INVALID_DESCRIPTION_DESC
+            + PRICE_FULL_B, Description.MESSAGE_CONSTRAINTS);
+
+        // invalid price
+        assertParseFailure(parser, NAME_FULL_B + CATEGORY_FULL_B + EXPIRY_DATE_FULL_B + DESCRIPTION_FULL_B
+            + INVALID_PRICE_DESC, Price.MESSAGE_CONSTRAINTS);
+
+        // non-empty preamble
+        assertParseFailure(parser, PREAMBLE_NON_EMPTY + NAME_FULL_B + CATEGORY_FULL_B + EXPIRY_DATE_FULL_B
+                + DESCRIPTION_FULL_B + PRICE_FULL_B,
+            String.format(MESSAGE_INVALID_COMMAND_FORMAT, AddCommand.MESSAGE_USAGE));
     }
 }
diff --git a/src/test/java/seedu/ibook/logic/parser/FindCommandParserTest.java b/src/test/java/seedu/ibook/logic/parser/FindCommandParserTest.java
index 47f9fc6eba2..8a4b788267f 100644
--- a/src/test/java/seedu/ibook/logic/parser/FindCommandParserTest.java
+++ b/src/test/java/seedu/ibook/logic/parser/FindCommandParserTest.java
@@ -41,9 +41,9 @@ public void parse_validArgs_returnsFindCommand() {
         FindCommand expectedFindCommand2 =
                 new FindCommand(new ProductFulfillsFiltersPredicate(new Product (
                         new Name("Maggi"),
-                        Category.WILDCATEGORY,
+                        Category.WILD_CATEGORY,
                         new ExpiryDate("2022-01-01"),
-                        Description.WILDDESCRIPTION,
+                        Description.WILD_DESCRIPTION,
                         new Price("3.00")))
                 );
 
diff --git a/src/test/java/seedu/ibook/model/IBookTest.java b/src/test/java/seedu/ibook/model/IBookTest.java
index fef26473d08..37926b0cf0e 100644
--- a/src/test/java/seedu/ibook/model/IBookTest.java
+++ b/src/test/java/seedu/ibook/model/IBookTest.java
@@ -1,14 +1,13 @@
 package seedu.ibook.model;
-/*
+
 import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertFalse;
 import static org.junit.jupiter.api.Assertions.assertTrue;
-
-import static seedu.ibook.logic.commands.CommandTestUtil.VALID_ADDRESS_BOB;
-import static seedu.ibook.logic.commands.CommandTestUtil.VALID_TAG_HUSBAND;
+import static seedu.ibook.logic.commands.CommandTestUtil.VALID_DESCRIPTION_B;
+import static seedu.ibook.logic.commands.CommandTestUtil.VALID_PRICE_B;
 import static seedu.ibook.testutil.Assert.assertThrows;
-import static seedu.ibook.testutil.TypicalPersons.ALICE;
-import static seedu.ibook.testutil.TypicalPersons.getTypicalAddressBook;
+import static seedu.ibook.testutil.TypicalProducts.PRODUCT_A;
+import static seedu.ibook.testutil.TypicalProducts.getTypicalIBook;
 
 import java.util.Arrays;
 import java.util.Collection;
@@ -19,87 +18,88 @@
 
 import javafx.collections.FXCollections;
 import javafx.collections.ObservableList;
-import seedu.ibook.model.person.Person;
-import seedu.ibook.model.person.exceptions.DuplicatePersonException;
-import seedu.ibook.testutil.PersonBuilder;
+import seedu.ibook.model.product.Product;
+import seedu.ibook.model.product.exceptions.DuplicateProductException;
+import seedu.ibook.testutil.ProductBuilder;
 
 
- */
 public class IBookTest {
-/*
-    private final AddressBook addressBook = new AddressBook();
+    private final IBook iBook = new IBook();
 
     @Test
     public void constructor() {
-        assertEquals(Collections.emptyList(), addressBook.getPersonList());
+        assertEquals(Collections.emptyList(), iBook.getProductList());
     }
 
     @Test
     public void resetData_null_throwsNullPointerException() {
-        assertThrows(NullPointerException.class, () -> addressBook.resetData(null));
+        assertThrows(NullPointerException.class, () -> iBook.resetData(null));
     }
 
     @Test
-    public void resetData_withValidReadOnlyAddressBook_replacesData() {
-        AddressBook newData = getTypicalAddressBook();
-        addressBook.resetData(newData);
-        assertEquals(newData, addressBook);
+    public void resetData_withValidReadOnlyIBook_replacesData() {
+        IBook newData = getTypicalIBook();
+        iBook.resetData(newData);
+        assertEquals(newData, iBook);
     }
 
     @Test
-    public void resetData_withDuplicatePersons_throwsDuplicatePersonException() {
-        // Two persons with the same identity fields
-        Person editedAlice = new PersonBuilder(ALICE).withAddress(VALID_ADDRESS_BOB).withTags(VALID_TAG_HUSBAND)
+    public void resetData_withDuplicateProducts_throwsDuplicateProductException() {
+        // Two products with the same identity fields
+        Product editedProduct = new ProductBuilder(PRODUCT_A)
+                .withPrice(VALID_PRICE_B)
+                .withDescription(VALID_DESCRIPTION_B)
                 .build();
-        List<Person> newPersons = Arrays.asList(ALICE, editedAlice);
-        AddressBookStub newData = new AddressBookStub(newPersons);
+        List<Product> newProducts = Arrays.asList(PRODUCT_A, editedProduct);
+        IBookStub newData = new IBookStub(newProducts);
 
-        assertThrows(DuplicatePersonException.class, () -> addressBook.resetData(newData));
+        assertThrows(DuplicateProductException.class, () -> iBook.resetData(newData));
     }
 
     @Test
-    public void hasPerson_nullPerson_throwsNullPointerException() {
-        assertThrows(NullPointerException.class, () -> addressBook.hasPerson(null));
+    public void hasProduct_nullProduct_throwsNullPointerException() {
+        assertThrows(NullPointerException.class, () -> iBook.hasProduct(null));
     }
 
     @Test
-    public void hasPerson_personNotInAddressBook_returnsFalse() {
-        assertFalse(addressBook.hasPerson(ALICE));
+    public void hasProduct_productNotInIBook_returnsFalse() {
+        assertFalse(iBook.hasProduct(PRODUCT_A));
     }
 
     @Test
-    public void hasPerson_personInAddressBook_returnsTrue() {
-        addressBook.addPerson(ALICE);
-        assertTrue(addressBook.hasPerson(ALICE));
+    public void hasProduct_productInIBook_returnsTrue() {
+        iBook.addProduct(PRODUCT_A);
+        assertTrue(iBook.hasProduct(PRODUCT_A));
     }
 
     @Test
-    public void hasPerson_personWithSameIdentityFieldsInAddressBook_returnsTrue() {
-        addressBook.addPerson(ALICE);
-        Person editedAlice = new PersonBuilder(ALICE).withAddress(VALID_ADDRESS_BOB).withTags(VALID_TAG_HUSBAND)
+    public void hasProduct_productWithSameIdentityFieldsInIBook_returnsTrue() {
+        iBook.addProduct(PRODUCT_A);
+        Product editedProduct = new ProductBuilder(PRODUCT_A)
+                .withPrice(VALID_PRICE_B)
+                .withDescription(VALID_DESCRIPTION_B)
                 .build();
-        assertTrue(addressBook.hasPerson(editedAlice));
+        assertTrue(iBook.hasProduct(editedProduct));
     }
 
     @Test
-    public void getPersonList_modifyList_throwsUnsupportedOperationException() {
-        assertThrows(UnsupportedOperationException.class, () -> addressBook.getPersonList().remove(0));
+    public void getProductList_modifyList_throwsUnsupportedOperationException() {
+        assertThrows(UnsupportedOperationException.class, () -> iBook.getProductList().remove(0));
     }
 
     /**
-     * A stub ReadOnlyAddressBook whose persons list can violate interface constraints.
-
-    private static class AddressBookStub implements ReadOnlyAddressBook {
-        private final ObservableList<Person> persons = FXCollections.observableArrayList();
+     * A stub ReadOnlyIBook whose products list can violate interface constraints.
+     */
+    private static class IBookStub implements ReadOnlyIBook {
+        private final ObservableList<Product> products = FXCollections.observableArrayList();
 
-        AddressBookStub(Collection<Person> persons) {
-            this.persons.setAll(persons);
+        IBookStub(Collection<Product> products) {
+            this.products.setAll(products);
         }
 
         @Override
-        public ObservableList<Person> getPersonList() {
-            return persons;
+        public ObservableList<Product> getProductList() {
+            return products;
         }
     }
-    */
 }
diff --git a/src/test/java/seedu/ibook/model/ModelManagerTest.java b/src/test/java/seedu/ibook/model/ModelManagerTest.java
index 09c99123eba..dbc6a844f2e 100644
--- a/src/test/java/seedu/ibook/model/ModelManagerTest.java
+++ b/src/test/java/seedu/ibook/model/ModelManagerTest.java
@@ -1,37 +1,30 @@
 package seedu.ibook.model;
-/*
+
 import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertFalse;
 import static org.junit.jupiter.api.Assertions.assertTrue;
-import static seedu.ibook.model.Model.PREDICATE_SHOW_ALL_PERSONS;
+import static seedu.ibook.model.Model.PREDICATE_SHOW_ALL_PRODUCTS;
 import static seedu.ibook.testutil.Assert.assertThrows;
-
-import static seedu.ibook.testutil.TypicalPersons.ALICE;
-import static seedu.ibook.testutil.TypicalPersons.BENSON;
-
-
+import static seedu.ibook.testutil.TypicalProducts.PRODUCT_A;
+import static seedu.ibook.testutil.TypicalProducts.PRODUCT_B;
 
 import java.nio.file.Path;
 import java.nio.file.Paths;
-import java.util.Arrays;
 
 import org.junit.jupiter.api.Test;
 
 import seedu.ibook.commons.core.GuiSettings;
-import seedu.ibook.model.person.NameContainsKeywordsPredicate;
-import seedu.ibook.testutil.AddressBookBuilder;
-
+import seedu.ibook.model.product.ProductFulfillsFiltersPredicate;
+import seedu.ibook.testutil.IBookBuilder;
 
- */
 public class ModelManagerTest {
-/*
     private ModelManager modelManager = new ModelManager();
 
     @Test
     public void constructor() {
-        assertEquals(new OldUserPrefs(), modelManager.getUserPrefs());
+        assertEquals(new UserPrefs(), modelManager.getUserPrefs());
         assertEquals(new GuiSettings(), modelManager.getGuiSettings());
-        assertEquals(new AddressBook(), new AddressBook(modelManager.getAddressBook()));
+        assertEquals(new IBook(), new IBook(modelManager.getIBook()));
     }
 
     @Test
@@ -41,15 +34,15 @@ public void setUserPrefs_nullUserPrefs_throwsNullPointerException() {
 
     @Test
     public void setUserPrefs_validUserPrefs_copiesUserPrefs() {
-        OldUserPrefs userPrefs = new OldUserPrefs();
-        userPrefs.setAddressBookFilePath(Paths.get("address/book/file/path"));
+        UserPrefs userPrefs = new UserPrefs();
+        userPrefs.setIBookFilePath(Paths.get("ibook/file/path"));
         userPrefs.setGuiSettings(new GuiSettings(1, 2, 3, 4));
         modelManager.setUserPrefs(userPrefs);
         assertEquals(userPrefs, modelManager.getUserPrefs());
 
         // Modifying userPrefs should not modify modelManager's userPrefs
-        OldUserPrefs oldUserPrefs = new OldUserPrefs(userPrefs);
-        userPrefs.setAddressBookFilePath(Paths.get("new/address/book/file/path"));
+        UserPrefs oldUserPrefs = new UserPrefs(userPrefs);
+        userPrefs.setIBookFilePath(Paths.get("new/ibook/file/path"));
         assertEquals(oldUserPrefs, modelManager.getUserPrefs());
     }
 
@@ -66,47 +59,47 @@ public void setGuiSettings_validGuiSettings_setsGuiSettings() {
     }
 
     @Test
-    public void setAddressBookFilePath_nullPath_throwsNullPointerException() {
-        assertThrows(NullPointerException.class, () -> modelManager.setAddressBookFilePath(null));
+    public void setIBookFilePath_nullPath_throwsNullPointerException() {
+        assertThrows(NullPointerException.class, () -> modelManager.setIBookFilePath(null));
     }
 
     @Test
-    public void setAddressBookFilePath_validPath_setsAddressBookFilePath() {
-        Path path = Paths.get("address/book/file/path");
-        modelManager.setAddressBookFilePath(path);
-        assertEquals(path, modelManager.getAddressBookFilePath());
+    public void setIBookFilePath_validPath_setsIBookFilePath() {
+        Path path = Paths.get("ibook/file/path");
+        modelManager.setIBookFilePath(path);
+        assertEquals(path, modelManager.getIBookFilePath());
     }
 
     @Test
-    public void hasPerson_nullPerson_throwsNullPointerException() {
-        assertThrows(NullPointerException.class, () -> modelManager.hasPerson(null));
+    public void hasProduct_nullProduct_throwsNullPointerException() {
+        assertThrows(NullPointerException.class, () -> modelManager.hasProduct(null));
     }
 
     @Test
-    public void hasPerson_personNotInAddressBook_returnsFalse() {
-        assertFalse(modelManager.hasPerson(ALICE));
+    public void hasProduct_productNotInIBook_returnsFalse() {
+        assertFalse(modelManager.hasProduct(PRODUCT_A));
     }
 
     @Test
-    public void hasPerson_personInAddressBook_returnsTrue() {
-        modelManager.addPerson(ALICE);
-        assertTrue(modelManager.hasPerson(ALICE));
+    public void hasProduct_productInIBook_returnsTrue() {
+        modelManager.addProduct(PRODUCT_A);
+        assertTrue(modelManager.hasProduct(PRODUCT_A));
     }
 
     @Test
-    public void getFilteredPersonList_modifyList_throwsUnsupportedOperationException() {
-        assertThrows(UnsupportedOperationException.class, () -> modelManager.getFilteredPersonList().remove(0));
+    public void getFilteredProductList_modifyList_throwsUnsupportedOperationException() {
+        assertThrows(UnsupportedOperationException.class, () -> modelManager.getFilteredProductList().remove(0));
     }
 
     @Test
     public void equals() {
-        AddressBook addressBook = new AddressBookBuilder().withPerson(ALICE).withPerson(BENSON).build();
-        AddressBook differentAddressBook = new AddressBook();
-        OldUserPrefs userPrefs = new OldUserPrefs();
+        IBook iBook = new IBookBuilder().withProduct(PRODUCT_A).withProduct(PRODUCT_B).build();
+        IBook differentIBook = new IBook();
+        UserPrefs userPrefs = new UserPrefs();
 
         // same values -> returns true
-        modelManager = new ModelManager(addressBook, userPrefs);
-        ModelManager modelManagerCopy = new ModelManager(addressBook, userPrefs);
+        modelManager = new ModelManager(iBook, userPrefs);
+        ModelManager modelManagerCopy = new ModelManager(iBook, userPrefs);
         assertTrue(modelManager.equals(modelManagerCopy));
 
         // same object -> returns true
@@ -118,22 +111,20 @@ public void equals() {
         // different types -> returns false
         assertFalse(modelManager.equals(5));
 
-        // different addressBook -> returns false
-        assertFalse(modelManager.equals(new ModelManager(differentAddressBook, userPrefs)));
+        // different iBook -> returns false
+        assertFalse(modelManager.equals(new ModelManager(differentIBook, userPrefs)));
 
         // different filteredList -> returns false
-        String[] keywords = ALICE.getName().fullName.split("\\s+");
-        modelManager.updateFilteredPersonList(new NameContainsKeywordsPredicate(Arrays.asList(keywords)));
-        assertFalse(modelManager.equals(new ModelManager(addressBook, userPrefs)));
+        modelManager.updateFilteredProductList(new ProductFulfillsFiltersPredicate(PRODUCT_B));
+        assertFalse(modelManager.equals(new ModelManager(iBook, userPrefs)));
 
         // resets modelManager to initial state for upcoming tests
-        modelManager.updateFilteredPersonList(PREDICATE_SHOW_ALL_PERSONS);
+        modelManager.updateFilteredProductList(PREDICATE_SHOW_ALL_PRODUCTS);
 
         // different userPrefs -> returns false
-        OldUserPrefs differentUserPrefs = new OldUserPrefs();
-        differentUserPrefs.setAddressBookFilePath(Paths.get("differentFilePath"));
-        assertFalse(modelManager.equals(new ModelManager(addressBook, differentUserPrefs)));
+        UserPrefs differentUserPrefs = new UserPrefs();
+        differentUserPrefs.setIBookFilePath(Paths.get("differentFilePath"));
+        assertFalse(modelManager.equals(new ModelManager(iBook, differentUserPrefs)));
     }
 
- */
 }
diff --git a/src/test/java/seedu/ibook/model/tag/TagTest.java b/src/test/java/seedu/ibook/model/tag/TagTest.java
deleted file mode 100644
index 2418d50b28c..00000000000
--- a/src/test/java/seedu/ibook/model/tag/TagTest.java
+++ /dev/null
@@ -1,26 +0,0 @@
-package seedu.ibook.model.tag;
-
-import static seedu.ibook.testutil.Assert.assertThrows;
-
-import org.junit.jupiter.api.Test;
-
-public class TagTest {
-
-    @Test
-    public void constructor_null_throwsNullPointerException() {
-        assertThrows(NullPointerException.class, () -> new Tag(null));
-    }
-
-    @Test
-    public void constructor_invalidTagName_throwsIllegalArgumentException() {
-        String invalidTagName = "";
-        assertThrows(IllegalArgumentException.class, () -> new Tag(invalidTagName));
-    }
-
-    @Test
-    public void isValidTagName() {
-        // null tag name
-        assertThrows(NullPointerException.class, () -> Tag.isValidTagName(null));
-    }
-
-}